*,
 ::after,
 ::before {
     box-sizing: border-box
 }



 article,
 aside,
 footer,
 header,
 main,
 nav,
 section {
     display: block
 }

 body {
     margin: 0;
 }

 hr {
     box-sizing: content-box;
     height: 0;
     overflow: visible;
     margin-top: 1rem;
     margin-bottom: 1rem;
     border: 0;
     border-top: 1px solid rgba(0, 0, 0, .1)
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 .h5,
 .h6 {
     margin-top: 0;
     margin-bottom: .5rem
 }

 p {
     margin-top: 0;
 }

 ol,
 ul {
     margin-top: 0;
     margin-bottom: 1rem
 }

 ul ul {
     margin-bottom: 0
 }

 b,
 strong {
     font-weight: bolder
 }

 small {
     font-size: 80%;
     font-weight: 400
 }

 a {
     color: #007bff;
     text-decoration: none;
     background-color: transparent
 }

 a:hover {
     color: #0056b3;
     text-decoration: underline
 }

 img {

     border-style: none;
     max-width: 100%;
     height: auto;
     display: block
 }

 table {
     border-collapse: collapse
 }

 button {
     border-radius: 0;
     margin: 0;
     font-family: inherit;
     font-size: inherit;
     line-height: inherit;
     overflow: visible;
     text-transform: none
 }

 button:focus {
     outline: 1px dotted;
     outline: 5px auto -webkit-focus-ring-color
 }

 [role=button] {
     cursor: pointer
 }

 [type=button],
 [type=submit],
 button {
     appearance: button
 }

 [type=button]:not(:disabled),
 [type=submit]:not(:disabled),
 button:not(:disabled) {
     cursor: pointer
 }

 input,
 select,
 textarea {
     margin: 0;
     font-family: inherit;
     font-size: inherit;
     line-height: inherit
 }

 input {
     overflow: visible
 }

 select {
     text-transform: none;
     word-wrap: normal
 }

 textarea {
     overflow: auto;
     resize: vertical
 }

 label {
     display: inline-block;
     margin-bottom: .5rem;
     font-family: sans-serif
 }

 input[type=checkbox] {
     box-sizing: border-box;
     padding: 0
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 .h5,
 .h6 {
     margin-bottom: .5rem;
     font-weight: 500;
     line-height: 1.2
 }

 h1 {
     font-size: 2.5rem
 }

 h2 {
     font-size: 2rem
 }

 

 h4 {
     font-size: 1.5rem
 }

 h5,
 .h5 {
     font-size: 1.25rem
 }

 .h6 {
     font-size: 1rem
 }

 hr {
     margin-top: 1rem;
     margin-bottom: 1rem;
     border: 0;
     border-top: 1px solid rgba(0, 0, 0, .1)
 }

 .img-fluid {
     max-width: 100%;
     height: auto
 }

 .container,
 .container-fluid {
     width: 100%;
     padding-right: 15px;
     padding-left: 15px;
     margin-right: auto;
     margin-left: auto
 }

 .row {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     margin-right: -15px;
     margin-left: -15px
 }

 .col-4,
 .col-6,
 .col-8,
 .col-12,
 .col-auto,
 .col-lg-12,
 .col-lg-2,
 .col-lg-3,
 .col-lg-4,
 .col-lg-5,
 .col-lg-6,
 .col-lg-7,
 .col-lg-8,
 .col-lg-9,
 .col-md-12,
 .col-md-2,
 .col-md-3,
 .col-md-4,
 .col-md-5,
 .col-md-6,
 .col-md-7,
 .col-md-8,
 .col-md-auto,
 .col-sm-12,
 .col-sm-6,
 .col-xl-4 {
     position: relative;
     width: 100%;
     padding-right: 15px;
     padding-left: 15px
 }

 .col-4 {
     -ms-flex: 0 0 33.333333%;
     flex: 0 0 33.333333%;
     max-width: 33.333333%
 }

 .col-6 {
     -ms-flex: 0 0 50%;
     flex: 0 0 50%;
     max-width: 50%
 }

 .col-8 {
     -ms-flex: 0 0 66.666667%;
     flex: 0 0 66.666667%;
     max-width: 66.666667%
 }

 .col-12 {
     
     flex: 0 0 100%;
     max-width: 100%
 }

 .col-auto {
     -ms-flex: 0 0 auto;
     flex: 0 0 auto;
     width: auto;
     max-width: 100%
 }

 .form-control {
     display: block;
     width: 100%;
     height: calc(1.5em + .75rem + 2px);
     padding: .375rem .75rem;
     font-size: 1rem;
     font-weight: 400;
     line-height: 1.5;
     color: #495057;
     background-color: #fff;
     background-clip: padding-box;
     border: 1px solid #ced4da;
     border-radius: .25rem;
     transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
     font-family: sans-serif
 }

 .form-control:focus {
     color: #495057;
     background-color: #fff;
     border-color: #853b8b;
     outline: 0;
 }

 .form-control::placeholder {
     color: #b5b7b9;
     opacity: .6
 }

 .form-control:disabled,
 .form-control[readonly] {
     background-color: #e9ecef;
     opacity: 1
 }

 textarea.form-control {
     height: auto
 }

 .form-group {
     margin-bottom: 1rem
 }

 .form-check-inline {
     display: -ms-inline-flexbox;
     display: inline-flex;
     -ms-flex-align: center;
     align-items: center;
     padding-left: 0;
     margin-right: .75rem
 }

 .btn {
     display: inline-block;
     font-weight: 400;
     color: #212529;
     text-align: center;
     vertical-align: middle;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     background-color: transparent;
     border: 1px solid transparent;
     padding: .375rem .75rem;
     font-size: 1rem;
     line-height: 1.5;
     border-radius: .25rem;
     transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
 }

 .btn:hover {
     color: #212529;
     text-decoration: none
 }

 .btn:focus {
     outline: 0;
     box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25)
 }

 .btn:disabled {
     opacity: .65
 }

 .btn:not(:disabled):not(.disabled) {
     cursor: pointer
 }

 .fade {
     transition: opacity .15s linear
 }

.collapse {
    visibility: hidden;
    height: 0;
    overflow: hidden;
    transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

.collapse.show {
    visibility: visible;
    height: auto;
}

.collapsing {
    height: 0;
    overflow: hidden;
    transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

 .dropdown {
     position: relative
 }

 .dropdown-toggle {
     white-space: nowrap
 }

 .dropdown-toggle::after {
     display: inline-block;
     margin-left: .255em;
     vertical-align: .255em;
     content: "";
     border-top: .3em solid;
     border-right: .3em solid transparent;
     border-bottom: 0;
     border-left: .3em solid transparent
 }

 .dropdown-toggle:empty::after {
     margin-left: 0
 }

 .dropdown-menu {
     position: absolute;
     top: 100%;
     left: 0;
     z-index: 1000;
     display: none;
     float: left;
     min-width: 10rem;
     padding: .5rem 0;
     margin: .125rem 0 0;
     font-size: 1rem;
     color: #212529;
     text-align: left;
     list-style: none;
     background-color: #fff;
     background-clip: padding-box;
     border: 1px solid rgba(0, 0, 0, .15);
     border-radius: .25rem
 }

 .input-group {
     position: relative;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -ms-flex-align: stretch;
     align-items: stretch;
     width: 100%
 }

 .input-group>.form-control {
     position: relative;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto;
     width: 1%;
     min-width: 0;
     margin-bottom: 0
 }

 .input-group>.form-control:not(:last-child) {
     border-top-right-radius: 0;
     border-bottom-right-radius: 0
 }

 .input-group>.form-control:not(:first-child) {
     border-top-left-radius: 0;
     border-bottom-left-radius: 0
 }

 .input-group-prepend {
     display: -ms-flexbox;
     display: flex;
     margin-right: -1px
 }

 .input-group-text {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     padding: .375rem .75rem;
     margin-bottom: 0;
     font-size: 1rem;
     font-weight: 400;
     line-height: 1.5;
     color: #495057;
     text-align: center;
     white-space: nowrap;
     background-color: #e9ecef;
     border: 1px solid #ced4da;
     border-radius: .25rem
 }

 .custom-control {
     position: relative;
     z-index: 1;
     display: block;
     min-height: 1.5rem;
     padding-left: 1.5rem
 }

 .custom-control-input {
     position: absolute;
     left: 0;
     z-index: -1;
     width: 1rem;
     height: 1.25rem;
     opacity: 0
 }

 .custom-control-input:checked~.custom-control-label::before {
     color: #fff;
     border-color: #007bff;
     background-color: #007bff
 }

 .custom-control-input:focus~.custom-control-label::before {
     box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25)
 }

 .custom-control-input:focus:not(:checked)~.custom-control-label::before {
     border-color: #80bdff
 }

 .custom-control-input:not(:disabled):active~.custom-control-label::before {
     color: #fff;
     background-color: #b3d7ff;
     border-color: #b3d7ff
 }

 .custom-control-input:disabled~.custom-control-label {
     color: #6c757d
 }

 .custom-control-input:disabled~.custom-control-label::before {
     background-color: #e9ecef
 }

 .custom-control-label {
     position: relative;
     margin-bottom: 0;
     vertical-align: top
 }

 .custom-control-label::before {
     position: absolute;
     top: .25rem;
     left: -1.5rem;
     display: block;
     width: 1rem;
     height: 1rem;
     pointer-events: none;
     content: "";
     background-color: #fff;
     border: #adb5bd solid 1px
 }

 .custom-control-label::after {
     position: absolute;
     top: .25rem;
     left: -1.5rem;
     display: block;
     width: 1rem;
     height: 1rem;
     content: "";
     background: no-repeat 50%/50% 50%
 }

 .custom-checkbox .custom-control-label::before {
     border-radius: .25rem
 }

 .custom-checkbox .custom-control-input:checked~.custom-control-label::after {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e")
 }

 .custom-control-label::before {
     transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
 }

 .nav-link {
     display: block;
     padding: .5rem 1rem
 }

 .nav-link:focus,
 .nav-link:hover {
     text-decoration: none
 }

 .navbar {
     position: relative;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: justify;
     justify-content: space-between;
     padding: .5rem 1rem
 }

 .navbar .container {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: justify;
     justify-content: space-between
 }

 .navbar-brand {
     display: inline-block;
     padding-top: .3125rem;
     padding-bottom: .3125rem;
     margin-right: 1rem;
     font-size: 1.25rem;
     line-height: inherit;
     white-space: nowrap
 }

 .navbar-brand:focus,
 .navbar-brand:hover {
     text-decoration: none
 }

 .navbar-nav {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     padding-left: 0;
     margin-bottom: 0;
     list-style: none
 }

 .navbar-nav .nav-link {
     padding-right: 0;
     padding-left: 0
 }

 .navbar-nav .dropdown-menu {
     position: static;
     float: none
 }

 .navbar-collapse {
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
     -ms-flex-positive: 1;
     flex-grow: 1;
     -ms-flex-align: center;
     align-items: center
 }

 .navbar-light .navbar-brand {
     color: rgba(0, 0, 0, .9)
 }

 .navbar-light .navbar-brand:focus,
 .navbar-light .navbar-brand:hover {
     color: rgba(0, 0, 0, .9)
 }

 .navbar-light .navbar-nav .nav-link {
     color: rgba(0, 0, 0, .5)
 }

 .navbar-light .navbar-nav .nav-link:focus,
 .navbar-light .navbar-nav .nav-link:hover {
     color: rgba(0, 0, 0, .7)
 }

 .navbar-light .navbar-nav .nav-link.active {
     color: rgba(0, 0, 0, .9)
 }

 .close {
     float: right;
     font-size: 1.5rem;
     font-weight: 700;
     line-height: 1;
     color: #000;
     text-shadow: 0 1px 0 #fff;
     opacity: .5
 }

 .close:hover {
     color: #000;
     text-decoration: none
 }

 .close:not(:disabled):not(.disabled):focus,
 .close:not(:disabled):not(.disabled):hover {
     opacity: .75
 }

 .modal-open {
     overflow: hidden
 }

 .modal-open .modal {
     overflow-x: hidden;
     overflow-y: auto
 }

 .modal {
     position: fixed;
     top: 0;
     left: 0;
     z-index: 1050;
     display: none;
     width: 100%;
     height: 100%;
     overflow: hidden;
     outline: 0
 }

 .modal-dialog {
     position: relative;
     width: auto;
     margin: .5rem;
     pointer-events: none
 }

 .modal.fade .modal-dialog {
     transition: -webkit-transform .3s ease-out;
     transition: transform .3s ease-out;
     transition: transform .3s ease-out, -webkit-transform .3s ease-out;
     -webkit-transform: translate(0, -50px);
     transform: translate(0, -50px)
 }

 .modal.show .modal-dialog {
     -webkit-transform: none;
     transform: none
 }

 .modal-content {
     position: relative;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     width: 100%;
     pointer-events: auto;
     background-color: #fff;
     background-size: 150px;
     background-image: url(../../imagenew/background/back-modal.svg);
     background-clip: padding-box;
     border: 1px solid rgba(0, 0, 0, .2);
     border-radius: .3rem;
     outline: 0
 }

 .modal-backdrop {
     position: fixed;
     top: 0;
     left: 0;
     z-index: 1040;
     width: 100vw;
     height: 100vh;
     background-color: #000
 }

 .modal-backdrop.fade {
     opacity: 0
 }

 .modal-backdrop.show {
     opacity: .5
 }

 .modal-body {
     position: relative;
     -ms-flex: 1 1 auto;
     flex: 1 1 auto;
     padding: 1rem
 }

 .breadcrumb {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     padding: .75rem 1rem;
     margin-bottom: 1rem;
     list-style: none;
     background-color: #e9ecef;
     border-radius: .25rem
 }

 .pagination {
     justify-content: center;
     display: -ms-flexbox;
     display: flex;
     padding-left: 0;
     list-style: none;
     border-radius: .25rem
 }

 .page-link {
     position: relative;
     display: block;
     padding: .5rem .75rem;
     margin-left: -1px;
     line-height: 1.25;
     color: #007bff;
     background-color: #fff;
     border: 1px solid #dee2e6
 }

 .page-link:hover {
     z-index: 2;
     color: #0056b3;
     text-decoration: none;
     background-color: #e9ecef;
     border-color: #dee2e6
 }

 .page-link:focus {
     z-index: 3;
     outline: 0;
     box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25)
 }

 .page-item:first-child .page-link {
     margin-left: 0;
     border-top-left-radius: .25rem;
     border-bottom-left-radius: .25rem
 }

 .page-item:last-child .page-link {
     border-top-right-radius: .25rem;
     border-bottom-right-radius: .25rem
 }

 .page-item.active .page-link {
     z-index: 3;
     color: #fff;
     background-color: #007bff;
     border-color: #007bff
 }

 .page-item.disabled .page-link {
     color: #6c757d;
     pointer-events: none;
     cursor: auto;
     background-color: #fff;
     border-color: #dee2e6
 }

 .alert {
     position: relative;
     padding: 8px 15px;
     margin-bottom: 1rem;
     border: 1px solid transparent;
     border-radius: .25rem;
     font-size: 13px
 }

 .alert-primary {
     color: #004085;
     background-color: #cce5ff;
     border-color: #b8daff
 }

 .bg-info {
     background-color: #17a2b8 !important
 }

 a.bg-info:focus,
 a.bg-info:hover {
     background-color: #117a8b !important
 }

 .bg-danger {
     background-color: #dc3545 !important
 }

 a.bg-danger:focus,
 a.bg-danger:hover {
     background-color: #bd2130 !important
 }

 .bg-light {
     background-color: #f8f9fa !important
 }

 .bg-white {
     background-color: #fff !important
 }

 .clearfix::after {
     display: block;
     clear: both;
     content: ""
 }

 .d-none {
     display: none !important
 }

 .d-flex {
     display: -ms-flexbox !important;
     display: flex !important
 }

 .flex-column {
     -ms-flex-direction: column !important;
     flex-direction: column !important
 }

 .flex-row-reverse {
     -ms-flex-direction: row-reverse !important;
     flex-direction: row-reverse !important
 }

 .flex-fill {
     -ms-flex: 1 1 auto !important;
     flex: 1 1 auto !important
 }

 .justify-content-center {
     -ms-flex-pack: center !important;
     justify-content: center !important
 }

 .position-relative {
     position: relative !important
 }

 .m-0 {
     margin: 0 !important
 }

 .mt-0 {
     margin-top: 0 !important
 }

 .mr-0 {
     margin-right: 0 !important
 }

 .mb-0 {
     margin-bottom: 0 !important
 }

 .ml-0 {
     margin-left: 0 !important
 }

 .mt-1 {
     margin-top: .25rem !important
 }

 .mb-1 {
     margin-bottom: .25rem !important
 }

 .mt-2 {
     margin-top: .5rem !important
 }

 .mr-2 {
     margin-right: .5rem !important
 }

 .mb-2 {
     margin-bottom: .5rem !important
 }

 .ml-2 {
     margin-left: .5rem !important
 }

 .mt-3 {
     margin-top: 1rem !important
 }

 .mr-3 {
     margin-right: 1rem !important
 }

 .mb-3 {
     margin-bottom: 1rem !important
 }

 .ml-3 {
     margin-left: 1rem !important
 }

 .mt-4 {
     margin-top: 1.5rem !important
 }

 .mb-4 {
     margin-bottom: 1.5rem !important
 }

 .mt-5 {
     margin-top: 3rem !important
 }

 .mb-5 {
     margin-bottom: 3rem !important
 }

 .pt-1,
 .py-1 {
     padding-top: .25rem !important
 }

 .pr-1 {
     padding-right: .25rem !important
 }

 .pb-1,
 .py-1 {
     padding-bottom: .25rem !important
 }

 .pl-1 {
     padding-left: .25rem !important
 }

 .pt-2 {
     padding-top: .5rem !important
 }

 .pr-2 {
     padding-right: .5rem !important
 }

 .pb-2 {
     padding-bottom: .5rem !important
 }

 .pl-2 {
     padding-left: .5rem !important
 }

 .pt-3 {
     padding-top: 1rem !important
 }

 .pr-3 {
     padding-right: 1rem !important
 }

 .pb-3 {
     padding-bottom: 1rem !important
 }

 .pl-3 {
     padding-left: 1rem !important
 }

 .pt-4 {
     padding-top: 1.5rem !important
 }

 .pr-4 {
     padding-right: 1.5rem !important
 }

 .pb-4 {
     padding-bottom: 1.5rem !important
 }

 .pl-4 {
     padding-left: 1.5rem !important
 }

 .pt-5 {
     padding-top: 3rem !important
 }

 .pr-5 {
     padding-right: 3rem !important
 }

 .pb-5 {
     padding-bottom: 3rem !important
 }

 .pl-5 {
     padding-left: 3rem !important
 }

 .mr-auto {
     margin-right: auto !important
 }

 .ml-auto {
     margin-left: auto !important
 }

 .text-left {
     text-align: left !important
 }

 .text-right {
     text-align: right !important
 }

 .text-center {
     text-align: center !important;
     text-align: -webkit-center !important;
 }

 .text-danger {
     color: #dc3545 !important
 }

 .btn-block {
     display: block;
     width: 100%
 }

 .owl-carousel,
 .owl-carousel .owl-item {
     -webkit-tap-highlight-color: transparent;
     position: relative
 }

 .owl-carousel {
     display: none;
     width: 100%;
     z-index: 1
 }

 .owl-carousel .owl-stage {
     position: relative;
     -ms-touch-action: pan-Y;
     touch-action: manipulation;
     -moz-backface-visibility: hidden;
     backface-visibility: hidden
 }

 .owl-carousel .owl-stage:after {
     content: ".";
     display: block;
     clear: both;
     visibility: hidden;
     line-height: 0;
     height: 0
 }

 .owl-carousel .owl-stage-outer {
     position: relative;
     overflow: hidden;
     transform: translate3d(0, 0, 0);
     -webkit-transform: translate3d(0, 0, 0)
 }

 .owl-carousel .owl-item {
     backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     -ms-backface-visibility: hidden;
     transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
     -ms-transform: translate3d(0, 0, 0)
 }

 .owl-carousel .owl-item {
     min-height: 1px;
     float: left;
     backface-visibility: hidden;
     -webkit-backface-visibility: hidden;
     -webkit-touch-callout: none
 }

 .owl-carousel .owl-dots.disabled,
 .owl-carousel .owl-nav.disabled {
     display: none
 }

 .owl-carousel.owl-loaded {
     display: block
 }

 .owl-carousel .owl-nav .owl-next,
 .owl-carousel .owl-nav .owl-prev {
     cursor: pointer;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none
 }

 .owl-carousel .owl-nav button.owl-next,
 .owl-carousel .owl-nav button.owl-prev {
     background: 0 0;
     color: inherit;
     border: none;
     padding: 0 !important;
     font: inherit
 }

 .owl-carousel.owl-drag .owl-item {
     -ms-touch-action: pan-y;
     touch-action: pan-y;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none
 }

 .owl-carousel.owl-rtl {
     direction: rtl
 }

 .owl-carousel.owl-rtl .owl-item {
     float: right;
     text-align: center
 }

 h1 {
     font-weight: 700;
     font-size: 32px
 }

 h2 {
     font-weight: 700;
     font-size: 26px
 }

 h3 {
     font-weight: 600;
     font-size: 21px
 }

 h4 {
     font-weight: 600;
     font-size: 20px
 }

 h5 {
     font-weight: 600;
     font-size: 18px
 }

 .clearfix {
     clear: both
 }

 .clearfix::after {
     content: "";
     clear: both;
     display: table
 }

 .btn {
     position: relative;
     padding: 16px 40px;
     margin: 0;
     border-radius: 0;
     font: 600 14px poppins, sans-serif;
     letter-spacing: .5px;
     text-transform: capitalize;
     overflow: hidden;
     -webkit-transition-property: all;
     transition-property: all;
     -webkit-transition-duration: 250ms;
     transition-duration: 250ms;
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
     -webkit-transition-delay: 0s;
     transition-delay: 0s
 }

 .btn:active {
     -webkit-box-shadow: none;
     box-shadow: none;
     outline: 0
 }

 .btn:focus {
     -webkit-box-shadow: none;
     box-shadow: none;
     outline: 0
 }

 button:active,
 button:focus {
     -webkit-box-shadow: none;
     box-shadow: none;
     outline: 0
 }

 .form-control {
     -webkit-box-shadow: none;
     box-shadow: none;
     font-size: 13px;
     color: #464646;
     padding: 1em;
     height: 45px;
     -webkit-transition-duration: .3s;
     transition-duration: .3s
 }

 

 input:focus,
 textarea:focus {
     border: 1.8px solid #853b8b;
     box-shadow: 0 1px 10px rgba(112, 57, 143, 0.51);
     -webkit-transition-duration: .3s;
     transition-duration: .3s
 }

 textarea {
     height: auto !important
 }

 .form-group {
     margin-bottom: 20px
 }

 a {
     color: #332f3b;
     text-decoration: none;
     -webkit-transition: all .3s ease;
     transition: all .3s ease
 }

 a:active {
     outline: 0;
     text-decoration: none
 }

 a:hover {
     color: #6610f2;
     outline: 0;
     text-decoration: none
 }

 a:focus {
     outline: 0;
     text-decoration: none
 }

 p {
     font-family: roboto, sans-serif;
     color: #554d63;
     font-size: 15.5px;
     font-weight: 400;
     margin-bottom: 15px;
     line-height: 1.8
 }

 u {
     text-underline-offset: 6px
 }

 img {
     max-width: 100%;
     height: auto;
     display: block
 }

 .pt-50 {
     padding-top: 50px
 }

 .pt-40 {
     padding-top: 40px
 }

 .pt-30 {
     padding-top: 30px
 }

 .pt-20 {
     padding-top: 20px
 }

 .pt-10 {
     padding-top: 10px
 }

 .pb-100 {
     padding-bottom: 100px
 }

 .pb-70 {
     padding-bottom: 70px
 }

 .pb-50 {
     padding-bottom: 50px
 }

 .pb-40 {
     padding-bottom: 40px
 }

 .pb-30 {
     padding-bottom: 30px
 }

 .pb-20 {
     padding-bottom: 20px
 }

 .pb-10 {
     padding-bottom: 10px
 }

 .pb-0 {
     padding-bottom: 0 !important
 }

 .ptb-50 {
     padding-top: 50px;
     padding-bottom: 50px
 }

 .pr-10 {
     padding-right: 10px
 }

 .pl-0 {
     padding-left: 0
 }

 .pr-0 {
     padding-right: 0
 }

 .bg-white {
     background-color: #fff !important
 }

 .bg-light {
     background-color: #f4f6fc !important
 }

 .bg-thin {
     background-color: #fcfcfc !important
 }

 .bg-tertiary {
     background-color: #5a49f8 !important
 }

 .bg-pintrest {
     background-color: #e60023 !important
 }

 .bg-twitter {
     background-color: #1d9bf0 !important
 }

 .bg-telegram {
     background-color: #24a2e0 !important
 }

 .bg-whatsup {
     background-color: #00e676 !important
 }

 .bg-danger {
     background: #ff2929 !important
 }

 .bg-info {
     background: #62e1fb !important
 }

 .bg-pink {
     background: #ff3681 !important
 }

 .section-title {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     text-align: center;
     width: 60%;
     margin: 0 auto 25px
 }

 .section-title h2 {
     text-transform: capitalize;
     display: inline-block;
     margin: 0;
     line-height: 1.3
 }

 .section-title p {
     margin-top: 15px;
     margin-bottom: 0
 }

 .form-control::placeholder {
     color: #333333 !important;
     opacity: 1 !important
 }

 .mean-container .mean-bar {
     float: left;
     width: 100%;
     position: absolute;
     background: 0 0;
     padding: 20px 0 0;
     z-index: 999;
     height: 55px
 }

 .mean-container a.meanmenu-reveal {
     width: 35px;
     height: 30px;
     padding: 12px 15px 0 0;
     position: absolute;
     right: 0;
     cursor: pointer;
     color: #111;
     text-decoration: none;
     font-size: 16px;
     text-indent: -9999em;
     line-height: 22px;
     font-size: 1px;
     display: block;
     font-weight: 700
 }

 .mean-container a.meanmenu-reveal span {
     display: block;
     background: #fff;
     height: 4px;
     margin-top: 3px;
     border-radius: 3px
 }

 .mean-container .mean-nav {
     float: left;
     width: 100%;
     background: #fff;
     margin-top: 55px
 }

 .mean-container .mean-nav ul {
     padding: 0;
     margin: 0;
     width: 100%;
     border: none;
     list-style-type: none
 }

 .mean-container .mean-nav ul li {
     position: relative;
     float: right;
     width: 100%;
     margin-right: 0
 }

 .mean-container .mean-nav ul li a {
     display: block;
     float: revert;
     width: 90%;
     padding: 1em 5%;
     margin: 0;
     text-align: left;
     color: #454646;
     text-decoration: none;
     font-size: 14px
 }

 .mean-container .mean-nav ul li a.active {
     color: #000
 }

 .mean-container .mean-nav ul li li a {
     background: #fff;
     width: 80%;
     padding: 1em 10%;
     color: #677294;
     opacity: 1;
     text-shadow: none !important;
     visibility: visible;
     text-transform: none;
     font-size: 14px
 }

 .mean-container .mean-nav ul li li a:hover {
     color: #6610f2
 }

 .mean-container .mean-nav ul li.mean-last a {
     border-bottom: none;
     margin-bottom: 0
 }

 .mean-container .mean-nav ul li a.mean-expand {
     margin-top: 3px;
     width: 100%;
     height: 24px;
     padding: 12px !important;
     text-align: right;
     position: absolute;
     right: 0;
     top: 0;
     z-index: 2;
     font-weight: 700;
     background: 0 0;
     border: none !important
 }

 .mean-container .mean-bar,
 .mean-container .mean-bar * {
     -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
     box-sizing: content-box
 }

 .mobile-nav {
     display: none
 }

 .mobile-nav.mean-container .mean-nav ul li a.active {
     color: #ff2d55
 }

 button {
     border: none;
     border-radius: 0;
     margin: 0;
     text-transform: none;
     background-color: transparent;
     background-image: none;
     padding: 0;
 }

 svg {
     display: block;
 }

 #mobile_menu.open {
     transform: translateX(0);
 }

 #mobile_menu {
     overflow-y: auto;
     overflow-x: hidden;
     transform: translateX(100%);
     transition: transform 0.3s ease-in-out;
 }

 .main-nav {
     background: #000;
     position: absolute;
     top: 0;
     left: 0;
     padding-top: 15px;
     padding-bottom: 15px;
     width: 100%;
     z-index: 999;
     height: auto
 }

 .mean-nav .dropdown-toggle::after {
     display: none
 }

 .navbar-light .navbar-brand,
 .navbar-light .navbar-brand:hover {
     color: #fff;
     font-weight: 700;
     text-transform: uppercase;
     line-height: 1
 }

 .main-nav nav ul {
     padding: 0;
     margin: 0;
     list-style-type: none
 }

 .main-nav nav .navbar-nav .nav-item {
     position: relative;
     padding: 15px 0
 }

 .main-nav nav .navbar-nav .nav-item a {
     font-weight: 500;
     font-size: 16px;
     text-transform: uppercase;
     color: #fff;
     padding-left: 0;
     padding-right: 0;
     padding-top: 0;
     padding-bottom: 0;
     margin-left: 15px;
     margin-right: 15px
 }

 .main-nav nav .navbar-nav .nav-item a.active,
 .main-nav nav .navbar-nav .nav-item a:focus,
 .main-nav nav .navbar-nav .nav-item a:hover {
     color: #ff2d55
 }

 .main-nav nav .navbar-nav .nav-item:hover a {
     color: #ff2d55
 }

 .main-nav nav .navbar-nav .nav-item .dropdown-menu {
     -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, .05);
     box-shadow: 0 0 30px 0 rgba(0, 0, 0, .05);
     background: #0d1028;
     position: absolute;
     top: 80px;
     left: 0;
     width: 250px;
     z-index: 99;
     display: block;
     padding-top: 20px;
     padding-left: 5px;
     padding-right: 5px;
     padding-bottom: 20px;
     opacity: 0;
     visibility: hidden;
     -webkit-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out
 }

 .main-nav nav .navbar-nav .nav-item .dropdown-menu li {
     position: relative;
     padding: 0
 }

 .main-nav nav .navbar-nav .nav-item .dropdown-menu li a {
     font-size: 15px;
     font-weight: 500;
     text-transform: capitalize;
     padding: 9px 15px;
     margin: 0;
     display: block;
     color: #fff
 }

 .main-nav nav .navbar-nav .nav-item .dropdown-menu li a.active,
 .main-nav nav .navbar-nav .nav-item .dropdown-menu li a:focus,
 .main-nav nav .navbar-nav .nav-item .dropdown-menu li a:hover {
     color: #ff2d55
 }

 .main-nav nav .navbar-nav .nav-item:hover ul {
     opacity: 1;
     visibility: visible
 }

 .main-nav nav .navbar-nav .nav-item:last-child .dropdown-menu {
     left: auto;
     right: 0
 }

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

     .mobile-nav {
         display: block;
         position: relative;
         max-width: 100%
     }

     .mobile-nav .logo {
         text-decoration: none;
         position: absolute;
         top: 11px;
         z-index: 999;
         left: 15px;
         color: #fff;
         font-weight: 700;
         text-transform: uppercase;
         font-size: 20px
     }

     .mean-container .mean-bar {
         padding: 0
     }

     .mean-container a.meanmenu-reveal {
         padding: 15px 15px 0 0
     }

     .mobile-nav nav .navbar-nav {
         max-height: 600px;
         overflow-y: auto;
         min-height: 200px
     }

     .mobile-nav nav .navbar-nav .nav-item a i {
         display: block
     }

     .main-nav {
         display: none !important
     }
 }

 .navbar-area {
     position: fixed;
     top: 0;
     left: 0;
     padding: 0;
     width: 100%;
     z-index: 200;
     backdrop-filter: blur(8px)
 }

 .navbar-area .mobile-nav.mean-container .mean-nav ul li a.active {
     color: #6610f2
 }

 .navbar-area .main-nav {
     position: relative;
     padding: 0;
     background: linear-gradient(to left, #351080, #e6336c)
 }

 .navbar-area .main-nav .navbar {
     padding: 0
 }

 .navbar-area .main-nav .navbar .navbar-brand img:first-child {
     display: inline-block
 }

 .navbar-area .main-nav .navbar .navbar-brand img:last-child {
     display: none
 }

 .navbar-area .main-nav .navbar .navbar-nav {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center
 }

 .navbar-area .main-nav .navbar .search-item {
     margin: 0 15px
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item {
     padding: 0
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item a {
     position: relative;
     overflow: hidden;
     font-weight: 500;
     font-size: 15px;
     text-transform: capitalize;
     color: #fff;
     padding-top: 20px;
     padding-bottom: 15px
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item>a:hover::before {
     width: 100%
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item>a::before {
     position: absolute;
     content: "";
     width: 0;
     height: 4px;
     left: 0;
     bottom: 5px;
     background: #edf037;
     border-radius: 3px;
     -webkit-transition-property: all;
     transition-property: all;
     -webkit-transition-duration: .3s;
     transition-duration: .3s;
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
     -webkit-transition-delay: 0s;
     transition-delay: 0s
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item a.active::before {
     width: 100%
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu {
     box-shadow: 0 0 30px rgba(0, 0, 0, .19);
     background: #fff;
     margin-top: 8px;
     border: 1px solid transparent;
     border-radius: 5px;
     display: block;
     width: 250px;
     padding: 8px 0;
     margin-left: 15px;
     transition-property: all;
     transition-duration: .3s;
     transition-timing-function: ease-in-out;
     transition-delay: 0s
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu::before {
     content: "";
     width: 12px;
     height: 12px;
     background: #fff;
     position: absolute;
     top: -6px;
     transform: rotate(45deg);
     right: 40px;
     border-left: 1px solid #fff;
     border-top: 1px solid #fff
 }

 .mega-menu::after {
     content: "";
     position: absolute;
     left: 0;
     bottom: -1px;
     width: 100%;
     height: 300px;
     background-image: url(../../imagenew/background/back-mega.webp);
     border-radius: 8px;
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item {
     position: relative
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item a {
     padding-top: 5px;
     padding-bottom: 5px
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link {
     color: #332f3b;
     padding-bottom: 10px;
     padding-top: 10px
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link:hover {
     color: #6610f2
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item a.active {
     color: #6610f2
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu .nav-item a.active::before {
     opacity: 0
 }

 .navbar-area .main-nav nav .navbar-nav .nav-item .dropdown-menu a {
     font-size: 15px;
     font-weight: 600;
     text-transform: capitalize;
     padding: 5px 10px;
     margin: 0;
     display: block
 }

 .navbar-area .main-nav nav .navbar-nav .dropdown-menu .nav-item a:hover::before,
 .navbar-area .main-nav nav .navbar-nav .dropdown-menu .nav-item a:focus::before {
     width: 0
 }

 .navbar-area .main-nav nav .dropdown-toggle::after {
     border: none;
     content: "\f107";
     font-family: fa-solid;
     font-size: 14px;
     margin-left: 5px;
     display: inline-block;
     margin-left: 5px;
     vertical-align: middle
 }

 .search-item {
     position: relative
 }

 .navbar-area.stickyadd .main-nav {
     background: #fff;
     -webkit-animation: slideInDown .5s ease-in-out 0s normal none 1 running;
     animation: slideInDown .5s ease-in-out 0s normal none 1 running;
     -webkit-box-shadow: 0 10px 15px rgba(51, 47, 59, .1);
     box-shadow: 0 10px 15px rgba(51, 47, 59, .1);
     top: 0
 }

 .navbar-area.stickyadd .main-nav .navbar .navbar-brand img:first-child {
     display: none
 }

 .navbar-area.stickyadd .main-nav .navbar .navbar-brand img:last-child {
     display: inline-block
 }

 .navbar-area.stickyadd .main-nav .navbar .nav-item a {
     padding-top: 20px;
     padding-bottom: 15px
 }

 .navbar-area.stickyadd .main-nav .navbar .nav-item a::before {
     background: #ac9c14
 }

 .navbar-area.stickyadd .main-nav .navbar .nav-item:hover a {
     color: #332f3b
 }

 .navbar-area.stickyadd .main-nav .navbar li .nav-link {
     color: #332f3b
 }

 .navbar-area.stickyadd .main-nav .navbar .dropdown-menu li a {
     padding: 9px 15px
 }

 .navbar-area.stickyadd .main-nav .new {
     color: #f9293d
 }

 .home-banner-area {
     position: relative;
     overflow: hidden;
     background-size: cover;
     z-index: 1;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column
 }

 .home-banner-area .banner-content {
     z-index: 3
 }

 .first-div h1 {
     font-size: 30px;
     line-height: 1.5em;
     margin-bottom: 0
 }



 .first-div {
     padding: 30px 0;
 }

 .shape-bottom {
     left: 0;
     position: absolute;
     right: 0;
     bottom: -1px;
     width: 100%
 }

 .home-banner-area.banner-type-one .banner-content {
     text-align: center
 }

 .promo-section {
     position: relative;
     margin-top: -30px;
     z-index: 4
 }

 .single-feature {
     position: relative;
     overflow: hidden;
     background: #fff;
     border-radius: .7em;
     margin-bottom: 30px;
     padding: 35px;
     -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     z-index: 1
 }

 .single-feature .single-feature-content {
     width: 100%;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     text-align: center
 }

 .single-feature::before,
 .single-feature::after {
     position: absolute;
     content: "";
     width: 70%;
     height: 60%;
     border-radius: 50%
 }

 .single-feature::before {
     top: -35%;
     left: -35%
 }

 .single-feature::after {
     bottom: -35%;
     right: -35%
 }

 .single-feature .single-feature-content h3 {
     font-size: 18px;
     line-height: 1.4;
     margin-bottom: 0;
     text-transform: capitalize
 }

 .Visit-site-i::before,
 .Visit-site-i::after {
     background: #00a2f3;
     background: radial-gradient(circle farthest-corner at 12.3% 19.3%, #5558da 0, #5fd1f9 100.2%)
 }

 .seo-i::before,
 .seo-i::after {
     background: #2c31ff;
     background: linear-gradient(to right, #b6f492, #338b93)
 }

 .aparat-i::before,
 .aparat-i::after {
     background: #df0f50;
     background: linear-gradient(0deg, #df0f50 0, #df0f50 100%)
 }

 .ads-i::before,
 .ads-i::after {
     background: #6f42c1;
     background: linear-gradient(290deg, #3d81ed 0, rgba(61, 129, 237, .92) 37%, rgba(161, 157, 113, .89) 50%, rgba(246, 182, 6, .91) 61%, rgba(50, 162, 80, .98) 90%, #32a250 100%) !important
 }

 .webdesign-i::before,
 .webdesign-i::after {
     background: #20c997;
     background: linear-gradient(65.5deg, #17cdcd -15.1%, #17195f 71.5%)
 }

 .instagram-i::before,
 .instagram-i::after {
     background: #2c31ff;
     background: linear-gradient(45deg, #f09433 0, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%)
 }

 .youtube-i::before,
 .youtube-i::after {
     background: #df0f50;
     background: linear-gradient(0deg, #ff2929 0, #ff2929 100%)
 }

 .google-i::before,
 .google-i::after {
     background: #6f42c1;
     background: linear-gradient(-120deg, #4285f4, #34a853, #fbbc05, #ea4335)
 }

 .about-section .section-title {
     -webkit-box-align: start;
     -ms-flex-align: start;
     align-items: flex-start;
     text-align: left;
     margin: 0;
     width: 100%
 }

 .about-section .about-text-blc p {
     margin: 15px 0
 }

 .about-section .row {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center
 }

 .about-section .about-img {
     text-align: center;
     position: relative
 }

 .faq {
     display: block;
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     opacity: .16;
     background-size: 300px;
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
 }

 .back-plan {
     display: block;
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     opacity: .16;
     background-size: 300px
 }

 .faq-section,
 .plan-section,
 .plan-seo-section {
     position: relative;
     padding: 40px 0;
 }

 .faq-section .panel-group .panel {
     border-radius: 5px;
     margin-bottom: 10px;
     overflow: hidden;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31)
 }

 .faq-section .panel-group .panel .panel-heading {
     padding: 0;
     background: #fff;
     position: relative
 }

 .faq-section .panel-group .panel-title {
     margin: 0
 }

 .faq-section .panel-group .panel-title a {
     display: block;
     padding: 15px;
     font-size: 15px;
     font-weight: 700;
     border: 0;
     margin: 0
 }

 .faq-section .panel-group .panel-title a:before {
     content: "\f107";
     font-family: fa-solid;
     width: 25px;
     height: 25px;
     line-height: 25px;
     border-radius: 50%;
     font-size: 16px;
     text-align: left;
     position: absolute;
     top: 50%;
     right: 25px;
     -webkit-transform: translateY(-50%);
     transform: translateY(-50%)
 }

 .faq-section .panel-group .panel-title a:hover {
     color: #9701b5
 }

 .faq-section .panel-group .panel-title a.collapsed:before {
     content: "\f106"
 }

 .faq-section .panel-group .panel-body {
     padding: 1em 1.5em;
     border: 0;
     border-top: 1px solid #e3e2e6;
     background: #fff
 }

 .faq-section .panel-group .panel-body p {
     margin: 0;
     font-size: 14px
 }

 .pricing-section {
     position: relative;
     overflow: hidden;
     z-index: 1
 }

 .pricing-section .pricing-item-single {
     position: relative;
     background: #fff;
     border-radius: 8px;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31);
     padding-bottom: 0
 }

 .pricing-section .box-bottom {
     text-align: center;
     margin-bottom: 0;
     background: #994d99;
     color: #fff;
     border-bottom-left-radius: 8px;
     border-bottom-right-radius: 8px;
     padding: 12px 0;
     font-size: 18px
 }

 .pricing-section .pricing-item-single:hover .box-bottom {
     background: #b3a111
 }

 .border-b-dotted {
     border-bottom: 1px dotted #000
 }

 .pricing-section .pricing-item-single {
     position: relative;
     width: 94%;
     text-align: center;
     padding-top: 30px
 }

 .pricing-section .pricing-item-single::after,
 .pricing-section .pricing-item-single::before {
     content: "";
     position: absolute;
     left: 0
 }

 .pricing-section .pricing-item-single::before {
     width: 100%;
     height: 100%;
     background: #fff;
     top: 0;
     z-index: -1;
     -webkit-clip-path: polygon(100% 0, 100% 85%, 50% 100%, 0 85%, 0 0);
     clip-path: polygon(100% 0, 100% 85%, 50% 100%, 0 85%, 0 0)
 }

 .pricing-section .pricing-item-single .content-text {
     padding: 12px 0;
     margin: 0 -13px 0;
     background-image: linear-gradient(to left, #351080, #e6336c);
     font-size: 32px;
     font-weight: 400;
     color: #fff;
     text-transform: uppercase;
     position: relative;
     text-align: center
 }

 .pricing-section .pricing-item-single .content-text::after,
 .pricing-section .pricing-item-single .content-text::before {
     border-top: 15px solid #835161;
     border-bottom: 15px solid transparent;
     position: absolute;
     bottom: -30px;
     content: ""
 }

 .pricing-section .pricing-item-single .content-text::after {
     border-right: 13px solid transparent;
     right: 0
 }

 .pricing-section .pricing-item-single .content-text::before {
     border-left: 13px solid transparent;
     left: 0
 }

 .pricing-section .pricing-item-single .pricing-item-list {
     text-align: center;
     padding: 25px 40px
 }

 .pricing-section .pricing-item-single .pricing-item-list ul {
     list-style-type: none;
     padding: 0;
     margin: 0;
     margin-bottom: 16px;
     text-align: left
 }

 .pricing-section .pricing-item-single .pricing-item-list ul li {
     font-size: 15px;
     color: #6a6377
 }

 .pricing-section .pricing-item-single .pricing-item-list ul li i {
     font-size: 20px;
     font-weight: 400;
     -webkit-padding-end: 7px;
     padding-inline-end: 7px;
     color: #20c997;
     vertical-align: middle
 }

 .pricing-section [class*=col-]:nth-child(2) {
     -webkit-transform: scale(1.1);
     transform: scale(1.1)
 }

 .works-section .work-single {
     position: relative;
     padding: 4.5em 5em;
     background: #fff;
     border-radius: .7em;
     margin-bottom: 30px;
     -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     z-index: 1
 }

 .works-section .work-single .work-single-content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     text-align: center
 }

 .works-section .work-single .work-single-content .index {
     position: absolute
 }

 .works-section .work-single .work-single-content .index span {
     opacity: .4;
     font-weight: 700;
     font-size: 6em;
     font-family: IRANSansX
 }

 .works-section [class^=col-]:nth-child(odd) .index {
     bottom: 0;
     -webkit-transform: translateY(50%);
     transform: translateY(50%)
 }

 .works-section [class^=col-]:nth-child(even) .work-single {
     margin-top: 30px
 }

 .works-section [class^=col-]:nth-child(even) .index {
     top: 0;
     -webkit-transform: translateY(-50%);
     transform: translateY(-50%)
 }

 .works-section [class^=col-]:nth-child(1) .work-single {
     background: linear-gradient(0deg, #6f42c1 0, #cfa8ff 100%)
 }

 .works-section [class^=col-]:nth-child(2) .work-single {
     background: linear-gradient(0deg, #00a2f3 0, #62e1fb 100%)
 }

 .works-section [class^=col-]:nth-child(3) .work-single {
     background: linear-gradient(0deg, #20c997 0, #7bf8d7 100%)
 }

 .works-section [class^=col-]:nth-child(4) .work-single {
     background: linear-gradient(0deg, #2c31ff 0, #a8aaf1 100%)
 }

 .bl {
     position: relative;
     padding: 60px 0;
     background: #f9f9f9ba;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31)
 }

 .blog-item-single {
     position: relative;
     overflow: hidden;
     text-align: left;
     margin-bottom: 30px;
     width: 350px;
     background-color: white;
     box-shadow: rgb(166, 163, 163) 0 0 4px 0
 }

 .blog-item-single .blog-item-img img {
     width: 100%;
     text-align: center
 }

 .catetitle {
     position: relative;
     border-bottom: 1px solid #795d7d;
     padding-bottom: 10px;
     font-size: 24px;
     color: #444044;
     font-weight: 600
 }

 .catetitle::after {
     content: "";
     width: 80px;
     height: 4px;
     position: absolute;
     bottom: 0;
     left: 0;
     background-color: #815d97;
     left: unset;
     right: 0
 }

 .box-cate {
     background-color: #f3f4f6;
     border: 1px solid #f3f4f6;
     padding: 8px;
     border-radius: 8px;
     box-shadow: rgba(0, 0, 0, .1) 0 0 5px 0, rgba(0, 0, 0, .1) 0 0 1px 0
 }

 .g-box,
 .g-box2 {
     border: .5px solid #eaeaea;
     padding: 15px 15px 5px 15px;
     background: #fff;
     margin-bottom: 10px;
     border-radius: 8px;
     margin-left: 8px;
     margin-right: 8px;
     text-align: center
 }

 .g-box:hover,
 .g-box2:hover {
     cursor: pointer;
     box-shadow: 0 5px 30px 0 rgb(181 157 181 / 32%)
 }

 .g-box p,
 .g-box2 p {
     text-align: center;
     font-size: 14px;
     color: #535353
 }

 .g-box:hover>p,
 .g-box2:hover>p {
     color: #035c71
 }

 .g-box img,
 .g-box2 img {
     display: inline;
 }

 .g-box2 p {
     font-size: 13px
 }

 .video-section {
     position: relative;
     z-index: 1;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31)
 }

 .video-section::before {
     position: absolute;
     content: "";
     left: 0;
     top: 0;
     width: 100%;
     opacity: .28;
     height: 100%;
     background: url(../../imagenew/background/background-f.svg) repeat right;
     background-size: 450px
 }

 .blog-grid .blog-item-single {
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
     border-radius: 5px;
     background: #fff
 }

 .blogtitle {
     position: relative;
     border-bottom: 1px solid #795d7d;
     padding-bottom: 10px;
     font-size: 27px;
     color: #444044
 }

 .blogtitle::after {
     content: "";
     width: 80px;
     height: 4px;
     position: absolute;
     bottom: 0;
     left: 0;
     background-color: #815d97;
     left: unset;
     right: 0
 }

 .footer-area .footer-widget {
     margin-bottom: 2em
 }

 .footer-area .footer-widget h5 {
     text-transform: capitalize;
     margin-bottom: 8px
 }

 .footer-area .footer-widget p {
     margin-bottom: 20px;
     letter-spacing: -.09px
 }

 .footer-area .footer-widget .footer-quick-links {
     padding: 0;
     list-style-type: none
 }

 .footer-area .footer-widget .footer-quick-links li {
     position: relative;
     margin-bottom: 15px;
     -webkit-transition-property: all;
     transition-property: all;
     -webkit-transition-duration: .3s;
     transition-duration: .3s;
     -webkit-transition-timing-function: ease-in-out;
     transition-timing-function: ease-in-out;
     -webkit-transition-delay: 0s;
     transition-delay: 0s;
     font-size: 14px;
     font-weight: 500
 }

 .footer-area .footer-widget .footer-quick-links li:hover a {
     color: #5a49f8
 }

 .footer-area .footer-widget .contact-info {
     position: relative;
     -webkit-padding-start: 30px;
     padding-inline-start: 30px;
     margin-bottom: 20px
 }

 .footer-area .footer-widget .contact-info p {
     display: inline
 }

 .footer-area .footer-widget .contact-info i {
     position: absolute;
     left: 0;
     font-size: 1.2em;
     color: #5a49f8;
     top: 9px
 }

 .copy-right-area {
     background: #efefef;
     text-align: center;
     border-top: 1px solid rgba(25, 25, 25, .15);
     margin-top: 130px;
     width: 100%;
     height: 60px;
     background: #fff;
     display: flex;
     align-items: center;
     text-align: center
 }

 

 .owl-carousel {
     position: relative
 }

 .owl-carousel .owl-nav.disabled+.owl-dots {
     margin-top: 20px
 }

 .owl-carousel .owl-dots {
     text-align: center;
     line-height: 0
 }

 .btn-login {
     align-items: center;
     background: #4f2286;
     border-radius: 8px;
     border-style: solid;
     border-width: 0px;
     border-color: rgb(229, 231, 235);
     color: rgb(255, 255, 255);
     display: flex;
     float: left;
     font-feature-settings: normal;
     font-size: 14px;
     font-variation-settings: normal;
     font-weight: 500;
     justify-content: center;
     line-height: 20px;
     overflow-x: hidden;
     overflow-y: hidden;
     box-shadow: 0 1px 10px rgba(112, 57, 143, 0.51)
 }

 .btn-login:hover {
     color: #fff;
     background: rgb(85, 52, 147);
 }

 .btn-login-modal {
     color: #fff;
     font-size: 14px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 12px 26px;
     border-radius: 4px;
     transition: all 450ms ease-in-out;
     background: #067345;
     box-shadow: 0 2px 13px 3px #fff3;
     border: 0
 }

 .btn-login-modal:hover {
     background: #0e955c;
     color: #fff;
     border: 0
 }

 .dashlink-mb {
     border-bottom: 1px dashed #86868678;
     padding: 10px 0;
 }

 .box-linkmb {
     margin: 15px 8px;
     padding: 8px;
     box-shadow: 0 1px 10px rgba(175, 175, 175, 0.51);
     border-radius: 8px;
 }

 ul li .submenumob {
     list-style: inside;
 }

 @media (max-width:991.98px) {
     .mega-menu {
         width: auto
     }

     #link-home {
         display: none
     }

     .navbar-area .mobile-nav .logo {
         top: 15px
     }

     .navbar-area .mobile-nav.mean-container {
         margin: 0 auto
     }

     .navbar-area .mobile-nav.mean-container .mean-bar {
         padding: 20px 0 0;
         position: relative
     }

     .navbar-area .mobile-nav.mean-container .mean-bar .mean-nav {
         float: right;
         width: 90%;
         margin-left: auto;
         margin-right: auto;
         -webkit-box-shadow: 0 10px 15px rgba(51, 47, 59, .1);
         box-shadow: 0 10px 15px rgba(51, 47, 59, .1)
     }

     .navbar-area .mobile-nav.mean-container .mean-bar .mean-nav ul li a {
         text-transform: capitalize
     }

     .navbar-area .mobile-nav.mean-container a.meanmenu-reveal {
         padding-top: 5px
     }

     .navbar-area .mobile-nav.mean-container a.meanmenu-reveal span {
         height: 3px;
         width: 20px
     }

     .navbar-area .mobile-nav.mean-container a.meanmenu-reveal span span {
         position: relative;
         width: 30px;
         top: 8px
     }

     .navbar-area .mobile-nav.mean-container a.logo img:first-child {
         display: inline-block
     }

     .navbar-area .mobile-nav.mean-container a.logo img:last-child {
         display: none
     }

     .navbar-area .search-item {
         position: absolute !important;
         top: 50%;
         right: 85px;
         -webkit-transform: translateY(-50%);
         transform: translateY(-50%);
         z-index: -1
     }

     .navbar-area.stickyadd {
         padding: 0
     }

     .navbar-area.stickyadd .mobile-nav.mean-container .mean-bar {
         -webkit-animation: slideInDown .5s ease-in-out 0s normal none 1 running;
         animation: slideInDown .5s ease-in-out 0s normal none 1 running;
         background: #fff;
         box-shadow: 0 10px 15px rgba(51, 47, 59, .1)
     }

     .navbar-area.stickyadd .mobile-nav.mean-container a.meanmenu-reveal {
         color: #332f3b
     }

     .navbar-area.stickyadd .mobile-nav.mean-container a.meanmenu-reveal span {
         background: #332f3b
     }

     .navbar-area.stickyadd .mobile-nav.mean-container a.logo img:first-child {
         display: none
     }

     .navbar-area.stickyadd .mobile-nav.mean-container a.logo img:last-child {
         display: inline-block
     }

     .navbar-area.stickyadd .mobile-nav.mean-container .search-item .search-btn {
         color: #332f3b
     }

     .btn-login {
         font-size: 12px;
     }
 }

 a,
 body,
 button,
 li,
 p,
 small,
 span,
 label,
 input,
 select,
 td,
 textarea,
 .form-control,
 .form-control::placeholder {
     font-family: IRANSansX;
     font-feature-settings: "ss02";
     color: #554d63;
 }

 .social-link1 a {
     display: inline-block;
     width: 32px;
     height: 32px;
     font-size: 18px;
     text-align: center;
     color: #fff;
     line-height: 30px;
     border-radius: 50%
 }

 .social-link1 a:hover {
     color: #fff;
     text-decoration: none
 }

 .ads-icon,
 .google-icon,
 .Visit-site-icon,
 .seo-icon,
 .aparat-icon,
 .instagram-icon,
 .youtube-icon,
 .webdesign-icon {
     display: inline-block;
     position: relative;
     width: 100px;
     height: 100px;
     background-size: 100px
 }

 .display-block {
     display: block !important
 }

 .works-section .work-single .work-single-content .fas {
     position: absolute;
     opacity: .2;
     font-size: 8em;
     color: #fff
 }

 .pb-20-head {
     padding-bottom: 20px !important
 }

 .padding-b30 {
     padding-bottom: 30px !important
 }

 .pricing-button {
     display: flex;
     justify-content: center;
     align-items: center;
     position: relative;
     top: 10px;
     min-height: 60px
 }

 .height85 {
     height: 85px !important
 }

 .height60 {
     height: 55px !important;
     position: relative;
     bottom: 5px
 }

 .he-48 {
     height: 48px;
     padding: .375rem .75rem
 }

 .he-38 {
     height: 38px !important;
     padding: .375rem .75rem !important
 }

 .font-14 {
     font-size: 14px;
     font-weight: 600
 }

 .font-12 {
     font-size: 12px !important
 }

 .c-co-l::after,
 .c-co-l::before {
     right: -1.5rem !important
 }

 .custom-control-input:checked~.custom-control-label::before {
     color: #fff;
     border-color: #6967ce;
     background-color: #6967ce
 }

 .color-puple {
     color: #6610f2
 }

 .box_price {
     border-radius: 5px;
     background: #fff;
     box-shadow: 0 0 10px #f5934859
 }

 .display_none {
     display: none
 }

 .display_flex {
     display: flex
 }

 footer p {
     font-size: 14px;
     letter-spacing: -.4px !important
 }

 .copy-right-area p {
     font-size: 15px !important
 }

 .h6-reg {
     color: #fff;
     font-size: 20px;
     font-weight: 600;
     text-align: center
 }

 footer {
     border-top: 1px solid #ddd;
     background-repeat: no-repeat;
     background: #fafafa4f;
     background-position-x: center;
     background-position-y: calc(100% - 60px);
     overflow: hidden;
     position: relative;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31);
 }

 footer::before {
     position: absolute;
     content: " ";
     right: 80%;
     width: 280px;
     height: 280px;
     bottom: 30%;
     background-size: 280px;
     background-repeat: no-repeat;
     opacity: .2;
     -webkit-animation: rotating 100s linear infinite;
     -moz-animation: rotating 100s linear infinite;
     -ms-animation: rotating 100s linear infinite;
     -o-animation: rotating 100s linear infinite;
     animation: rotating 100s linear infinite
 }

 footer::after {
     position: absolute;
     display: inline-block;
     content: "";
     left: 82%;
     top: 10%;
     width: 200px;
     height: 200px;
     background-size: 200px;
     background-repeat: no-repeat;
     opacity: .2;
     -webkit-animation: rotating 100s linear infinite;
     -moz-animation: rotating 100s linear infinite;
     -ms-animation: rotating 100s linear infinite;
     -o-animation: rotating 100s linear infinite;
     animation: rotating 100s linear infinite
 }

 .black {
     color: #111
 }

 #breadcrumb {
     position: relative
 }

 #breadcrumb ul.breadcrumb {
     padding: 10px 16px;
     list-style: none;
     background-color: transparent
 }

 #breadcrumb ul.breadcrumb li {
     display: inline;
     font-size: 16px;
     color: #554d63
 }

 #breadcrumb ul.breadcrumb li+li:before {
     
     color: #554d63;
     content: "/\00a0"
 }

 #breadcrumb ul.breadcrumb li a {
     color: #554d63;
     text-decoration: none
 }

 #breadcrumb ul.breadcrumb li a:hover {
     color: #6d0ba5;
     text-decoration: none
 }

 #nemad {
     margin: auto;
     text-align: center
 }

 footer #nemad img {
     width: 110px;
     height: 120px;
     display: inline-block
 }
  #nemad img {
     display: inline-block
 }

 .btn-solid3 {
     background: #fff !important;
     color: #140440 !important;
     box-shadow: 2px 2px 20px 4px #efeef0
 }

 .learn-selectak {
     color: #8f0693
 }

 .head-share::before {
     position: absolute;
     content: "";
     width: 100%;
     height: 100%;
     right: 0;
     bottom: 1px;
     background-position: 90% 100%;
     opacity: 55%
 }

 .head-share::after {
     position: absolute;
     content: "";
     width: 100%;
     height: 100%;
     right: 0;
     top: 15%;
     background-position: 0;
     opacity: 40%
 }

 .shared {
     padding-top: 170px;
     padding-bottom: 70px;
     background-image: linear-gradient(to left, #351080, #e6336c);
     position: relative
 }

 .shared h1,
 .back-seo-tools h1 {
     color: #fff;
     font-size: 32px;
     line-height: 1.3em;
     margin-bottom: 0
 }

 .col-tab {
     transform: scale(1.05);
     box-shadow: rgba(0, 0, 0, .1) 0 0 5px 0, rgba(0, 0, 0, .1) 0 0 1px 0;
     cursor: pointer
 }

 #terms p {
     line-height: 3;
     font-size: 15px
 }

 #terms .fa-check-circle {
     color: #28a745
 }

 .style-post img {
     display: inline-block;
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29) !important;
     background: #fff !important
 }

 .blog-details-desc ul {
     list-style: square;
     margin-right: 40px;
     margin-bottom: 15px
 }

 .blog-details-desc ul li {
     padding: 5px 0
 }

 .style-post {
     padding: 0 30px ;
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
     border-radius: 5px ;
     background: #fff;
     height: fit-content
 }

 .style-post1 {
     top: -30px;
     position: relative;
     z-index: 100
 }



 .under-text {
     text-decoration: underline;
     text-underline-position: under
 }

 .blog-details-desc ol {
     font-size: x-large;
 }

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

     #breadcrumb ul.breadcrumb li {
         font-size: 14px;
     }

     h2 {
         font-size: 22px
     }

     .page-title-shape {
         height: 230px
     }

     .about-section .about-text-blc p {
         padding: 0 12px
     }

     body {
         font-size: 14px;
         letter-spacing: -.1px !important
     }

     .pb-100,
     .pb-70 {
         padding-bottom: 30px
     }

     p,
     .text_box_post {
         font-size: 14px;
         font-weight: 500;
         padding: 0 8px
     }

     h3 {
         font-size: 20px
     }

     h5 {
         font-size: 18px
     }

     .btn {
         padding: 10px 20px;
         font-size: 14px
     }

     .list-q p {
         font-size: 14px !important
     }

     .input-group {
         width: 100% !important
     }

     .section-title {
         max-width: 100%;
         width: 100%;
         margin-left: 0;
         margin-right: 0;
         margin-bottom: 30px;
         text-align: center !important;
         -webkit-box-align: center !important;
         -ms-flex-align: center !important;
         align-items: center !important
     }

     .section-title h2 {
         font-size: 21px;
         text-align: center
     }

     .section-title p {
         max-width: 100%;
         font-size: 16px
     }

     .container {
         max-width: 100%
     }

     .form-control {
         height: 50px;
         padding: 1px 0 0 12px;
         font-size: 14px
     }

     .home-banner-area .banner-content {
         text-align: center;
         max-width: 100%
     }

     .first-div h1 {
         margin-bottom: 0;
         font-size: 22px
     }

     .first-div p {
         font-size: 14.5px
     }


     .home-banner-area.banner-type-one .banner-content {
         width: 95%;
         max-width: 100%;
         margin: auto
     }

     .promo-section {
         margin-top: -20px
     }

     .single-feature {
         padding: 40px 25px
     }

     .single-feature::after,
     .single-feature::before {
         opacity: 0
     }

     .works-section .work-single {
         margin-top: 0 !important;
         padding: 5em 2em
     }

     .faq-section .row {
         padding-top: 30px
     }

     .about-section {
         padding-bottom: 0
     }

     .about-section .section-title {
         text-align: left !important;
         -webkit-box-align: start !important;
         -ms-flex-align: start !important;
         align-items: flex-start !important
     }

     .about-section .about-img {
         padding-top: 5px
     }

     .about-section .col-lg-6:last-child {
         padding-bottom: 10px
     }

     .about-section.about-two .about-img {
         padding-top: 0
     }

     .about-section.about-two .col-lg-6:last-child {
         padding-top: 5px
     }

     .footer-area .footer-widget {
         margin-bottom: 1.5em
     }

     .pricing-section {
         padding-bottom: 0
     }

     .pricing-section .pricing-item-single {
         margin-bottom: 60px
     }

     .shared {
         padding-top: 98px
     }

     .shared h1 {
         font-size: 24px
     }

     .back-seo-tools h1 {
         font-size: 24px !important;
         color: white;
     }

     .style-post1 h2 {
         font-size: 22px;
         line-height: 1.5
     }

     .blog-details-desc ol {
         padding-right: 40px;
         padding-left: 0
     }
 }

 @media only screen and (max-width:767px) and (min-width:576px) {
     .home-banner-area.head-pric {
         padding-top: 105px
     }

     .container {
         max-width: 540px
     }

     .mobile-nav {
         max-width: 100%
     }

     .faq-section .row {
         padding-top: 30px
     }

     .promo-section [class*=col-] {
         width: 50%
     }

     .single-feature::after,
     .single-feature::before {
         opacity: 1
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {

     .pb-100,
     .pb-70 {
         padding-bottom: 60px
     }

     .container {
         max-width: 720px
     }

     .mobile-nav {
         max-width: 100%
     }

     .section-title {
         width: 100%;
         margin-bottom: 30px
     }

     .section-title p {
         max-width: 75%
     }

     .promo-section .single-feature {
         padding: 5em 1em
     }

     .pricing-section {
         padding-bottom: 60px
     }

     .pricing-section [class*=col-]:last-child {
         margin-top: 30px
     }

     .home-banner-area .banner-content {
         text-align: center;
         margin: 0 auto;
         width: 80% !important
     }

     .first-div h1 {
         margin-bottom: 15px;
         font-size: 30px
     }



     .pricing-section .section-title {
         padding-bottom: 50px
     }

     .about-section.about-two .col-lg-6:last-child {
         padding-top: 5px
     }
 }

 @media screen and (max-width:991px) {
     .works-section .work-single .work-single-content .index span {
         display: none
     }

     .works-section [class^=col-]:nth-child(even) .work-single {
         margin-top: 0
     }

     .pricing-section [class*=col-]:nth-child(2) {
         -webkit-transform: none;
         transform: none
     }

     ol {
         padding-left: 10px
     }
 }

 @media only screen and (min-width:992px) and (max-width:1199px) {
     .container {
         max-width: 960px
     }

     p {
         margin: 3px 0
     }

     .section-title p {
         margin: 0
     }


     .home-banner-area.banner-type-one .banner-content {
         width: 80%
     }

     .home-banner-area.banner-type-one .banner-content h1 {
         margin-bottom: 20px;
         font-size: 36px
     }

     .home-banner-area.banner-type-one .banner-content p {
         padding: 0 0 25px
     }

     .about-text-blc p {
         margin: 0
     }

     .tips-section .row,
     .about-section .row {
         -webkit-box-align: center;
         -ms-flex-align: center;
         align-items: center
     }

     .pricing-section {
         padding-bottom: 70px
     }

     .pricing-section .pricing-item-single {
         padding: 0 1.5em 1em
     }

     .pricing-section [class*=col-]:nth-child(2) {
         -webkit-transform: none;
         transform: none
     }
 }

 body {
     direction: rtl;
     text-align: right
 }

 .navbar-area .navbar-brand {
     margin-right: unset;
     margin-left: 16px
 }

 .navbar-area .main-nav .navbar-nav .nav-item a::before {
     left: unset;
     right: 0
 }

 .navbar-area .main-nav .nav-item .dropdown-menu {
     right: 0;
     margin-right: 15px;
     margin-left: 0;
     text-align: right
 }

 .navbar-area .main-nav .dropdown-toggle::after {
     margin-right: 6px;
     margin-left: 0 !important;
     vertical-align: unset !important
 }

 .about-section .section-title,
 .tips-section .section-title {
     text-align: right
 }

 .blog-item-single {
     text-align: right
 }

 .footer-area .footer-widget .footer-quick-links li::before {
     left: unset;
     right: 0
 }

 .footer-area .footer-widget .contact-info i {
     left: unset;
     right: 0
 }

 .pricing-section .pricing-item-single .pricing-item-list ul li {
     text-align: right;
     letter-spacing: 0;
     padding: 10px
 }

 .faq-section .panel-group .panel-title a:before {
     right: unset;
     left: 25px
 }

 .home-banner-area.head-pric {
     padding-top: 170px;
     background-image: linear-gradient(to left, #351080, #e6336c);
     padding-bottom: 0 !important
 }

 @media only screen and (max-width:767px) {
     .cadre-google h5 {
         font-size: 16px
     }

     .home-banner-area.head-pric {
         padding-top: 105px
     }

     .form-control {
         padding: 5px 12px 0 0
     }

     .style-post1 h2 {
         font-size: 22px;
         line-height: 1.5
     }
 }

 @media only screen and (max-width:991.98px) {
     .mobile-nav .logo {
         left: unset;
         right: 15px
     }

     .mean-container .mean-nav ul li a.mean-expand {
         text-align: left;
         right: auto;
         left: 0
     }

     .navbar-area .mobile-nav.mean-container a.meanmenu-reveal {
         right: unset !important;
         left: 0 !important
     }

     .mean-container a.meanmenu-reveal {
         padding: 15px 0 0 15px
     }

     .mean-nav a {
         text-align: right !important
     }

     .mean-container .mean-nav ul li a.mean-expand {
         text-align: left !important;
         right: auto;
         left: 0
     }

     .navbar-area .search-item {
         right: auto;
         left: 70px;
         height: 32px
     }

     .dropdown-menu a {
         text-align: right !important
     }
 }

 html {
     -webkit-font-smoothing: antialiased;
     font-size: 16px
 }

 .mt-40 {
     margin-top: 40px
 }

 .mt-20 {
     margin-top: 20px
 }

 .mt-10 {
     margin-top: 10px
 }

 .mb-20 {
     margin-bottom: 20px
 }

 .mb-5 {
     margin-bottom: 5px
 }

 .mr-40 {
     margin-right: 40px
 }

 h1,
 h2,
 h3,
 h4,
 h5 {
     color: #393939;
     font-family: IRANSansX;
     font-weight: 600;
     letter-spacing: -.7px;
     padding-top: 12px;
     padding-bottom: 10px
 }



 p.p-md {
     font-size: 1.125rem
 }

 a {
     color: #554d63;
     text-decoration: none;
     -webkit-transition: all .4s ease-in-out;
     -moz-transition: all .4s ease-in-out;
     -o-transition: all .4s ease-in-out;
     -ms-transition: all .4s ease-in-out;
     transition: all .4s ease-in-out
 }

 a:hover {
     color: #666;
     text-decoration: none
 }

 a:focus {
     outline: 0;
     text-decoration: none
 }

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

 .btn {
     background-color: transparent;
     color: #fff;
     font-size: 16px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .5px;
     padding: 14px 30px;
     border: 2px solid transparent;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     -webkit-transition: all 450ms ease-in-out;
     -moz-transition: all 450ms ease-in-out;
     -o-transition: all 450ms ease-in-out;
     -ms-transition: all 450ms ease-in-out;
     transition: all 450ms ease-in-out;
     font-family: IRANSansX
 }

 .section-title {
     text-align: center;
     margin-bottom: 35px
 }

 .section-title p {
     color: #535151;
     padding: 0 8%;
     margin-top: 16px;
     margin-bottom: 0
 }

 .page-link {
     color: #666;
     font-weight: 600;
     padding: 7px 14px;
     margin: 0 3px;
     background-color: transparent;
     border-color: transparent;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     -o-border-radius: 3px;
     border-radius: 3px
 }

 .page-item:first-child .page-link {
     border-top-left-radius: 3px;
     border-bottom-left-radius: 3px
 }

 .page-item:last-child .page-link {
     border-top-right-radius: 3px;
     border-bottom-right-radius: 3px
 }

 .page-item.disabled .page-link {
     color: #aaa;
     background-color: transparent;
     border-color: transparent
 }

 .page-item.active .page-link,
 .page-link:hover {
     background-color: #3a3953;
     color: #fff;
     border-color: #3a3953;
     box-shadow: 0 0 0 1px rgba(56, 60, 67, .05), 0 1px 3px 0 rgba(56, 60, 67, .15)
 }

 .page-link:focus {
     background-color: transparent;
     color: #666;
     border-color: transparent;
     box-shadow: 0 0
 }

 .blog-item-img {
     background: #fff
 }

 .blog-grid {
     background:url(../../imagenew/background/back-blog.webp);
     background-size: 150px 167px
 }
.box-group-1 {
  box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
  background: #fff;
  padding: 30px 0 0 0px;
  border-radius: 8px;
  border: 2px dashed #cfabff;
}
.box-group-con {
  box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
  background: #fff;
  padding: 30px;
  border-radius: 8px;
  border: 2px dashed #cfabff;
  height: fit-content;
}

 .work-single p {
     text-justify: inherit
 }

 .white-color {
     color: #fff
 }

 .red-color {
     color: #ef3f54
 }

 .mega-menu {
     width: 100%;
     overflow: inherit;
     padding-bottom: 60px;
     padding-left: 30px;
 }

 .mega-menu .mega-menu-p a {
     color: #363636;
     margin-bottom: 0;
     margin-top: 10px;
     padding-right: 10px;
     position: relative;
     z-index: 1;
 }

 .mega-menu .mega-menu-p a:hover,
 .mega-menu .mega-menu-p a.active {
     color: #6610f2 !important
 }

 .mega-menu .mega-menu-p a.active:before,
 .mega-menu .mega-menu-p a:hover:before {
     width: 80% !important
 }

 .highlight {
     position: fixed;
     width: 100vw;
     height: 0;
     background: rgba(250, 250, 250, .85);
     top: 0;
     left: 0;
     z-index: 100;
     transition: width .4s
 }

 .bar,
 .barfooter {
     height: 6px;
     width: 85px;
     background: #8f0693;
     margin: 12px auto 20px;
     position: relative;
     border-radius: 5px;
     overflow: hidden
 }

 .barfooter {
     height: 4px;
     width: 80px
 }

 .bar:before,
 .barfooter:before {
     content: "";
     position: absolute;
     left: 0;
     top: 0;
     height: 100%;
     width: 5px;
     background: #fff;
     animation-duration: 2s;
     -webkit-animation-timing-function: linear;
     animation-timing-function: linear;
     -webkit-animation-iteration-count: infinite;
     animation-iteration-count: infinite;
     -webkit-animation-name: MOVE-BG;
     animation-name: MOVE-BG
 }

 .list p:before,
 .list-q p:before {
     font-family: fa-solid;
     display: block;
     width: 20px;
     height: auto;
     float: right;
     margin: 0 0 0 6px;
     font-size: 20px;
     line-height: 1;
     color: #20c997
 }

 .list p:before {
     content: "\f058"
 }


 .list-q p:before {
     content: "\e9ec";
     height: 36px
 }

 .list-q p {
     font-size: 16px
 }

 .head-h2 {
     position: relative;
     bottom: 15px
 }

 .our-process-area {
     bottom: 15px;
     position: relative
 }

 .our-process-area .process-box .single-item {
     margin-bottom: 30px
 }

 .our-process-area .process-box .single-item:nth-child(2n) {
     margin-top: 50px
 }

 .our-process-area .process-box p {
     text-align: center
 }

 .our-process-area .process-box {
     position: relative;
     z-index: 1
 }

 .our-process-area .icon1,
 .our-process-area .icon2,
 .our-process-area .icon3,
 .our-process-area .icon4 {
     height: 100px;
     width: 100px;
     background-repeat: no-repeat;
     margin: 0 auto;
     margin-bottom: 10px
 }

 .our-process-area .icon1 {
     background-image: url(../../imagenew/seotoolswebp/speed.webp)
 }

 .our-process-area .icon2 {
     background-image: url(../../imagenew/seotoolswebp/meta.webp)
 }

 .our-process-area .icon3 {
     background-image: url(../../imagenew/seotoolswebp/schema.webp)
 }

 .our-process-area .icon4 {
     background-image: url(../../imagenew/seotoolswebp/seoSite.webp)
 }

 .our-process-area .process-box .item p {
     margin: 0
 }

 .our-process-area .process-box .item {
     padding: 60px 30px;
     background: #fff;
     box-shadow: 0 5px 30px 0 rgb(181 157 181 / 32%)
 }

 .our-process-area .process-box .item:hover {
     margin-top: 5px;
     cursor: pointer
 }

 #msg {
     font-size: 14px !important
 }

 .hero-newsletter-form {
     margin-top: 35px;
     margin-left: 10px
 }

 .hero-newsletter-form .input-group-btn {
     margin-left: 5px
 }

 .hero-newsletter-form .input-group>.form-control:not(:first-child) {
     border-top-right-radius: 6px !important;
     border-bottom-right-radius: 6px !important;
     border-top-left-radius: 6px !important;
     border-bottom-left-radius: 6px !important
 }

 .hero-newsletter-form .form-control {
     height: 50px;
     background-color: #fff;
     border: 1px solid #ccc;
     color: #666;
     font-size: 1.05rem;
     font-weight: 300;
     padding: 0 15px;
     box-shadow: none;
     -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
     -o-border-radius: 6px;
     border-radius: 6px;
     -webkit-transition: all .4s ease-in-out;
     -moz-transition: all .4s ease-in-out;
     -o-transition: all .4s ease-in-out;
     -ms-transition: all .4s ease-in-out;
     transition: all .4s ease-in-out
 }

 .hero-newsletter-form .form-control::placeholder {
     color: #8b868c !important;
     opacity: .6 !important
 }

 .input-group-btn .btn-new-seo {
     color: #fff;
     background-color: #9f3fef;
     font-size: 16px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 14px 26px;
     border-radius: 6px;
     border: 2px solid;
     border-color: #9f3fef
 }

 .input-group-btn .btn-new-seo:hover {
     font-size: 16px;
     background: #711bb8;
     transition: all 450ms ease-in-out;
     border-color: #711bb8
 }

 .btn-plan-seo {
     color: #fff;
     background-color: #d6782f;
     font-size: 14px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 6px 20px;
     border-radius: 6px;
     border: 2px solid;
     border-color: #d6782f
 }

 .btn-plan-seo:hover {
     color: #fff;
     background: #d66a14;
     transition: all 450ms ease-in-out;
     border-color: #d66a14
 }
  .btnLogin {
     color: #fff;
     background-color: #d6782f;
     font-size: 14px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 6px 20px;
     border-radius: 6px;
     border: 2px solid;
     border-color: #d6782f;
     cursor: pointer;
 }

 .btnLogin:hover {
     color: #fff;
     background: #d66a14;
     transition: all 450ms ease-in-out;
     border-color: #d66a14;
     cursor: pointer;
 }

 .box-analyiz {
     background-color: #00000024;
     padding: 16px !important;
     filter: drop-shadow(8px 8px 10px gray);
     border-radius: 8px
 }

 #loader-wrapper {
     position: relative;
     top: 0;
     left: 0;
     width: 100%;
     height: 200px;
     z-index: 1000
 }

 #loader-wrapper p {
     color: #4154f1;
     text-align: center;
     text-transform: capitalize;
     text-shadow: 0 0 10px #fff;
     font-weight: 700;
     margin: 30px auto 0;
     display: block
 }

 #loader {
     display: block;
     position: relative;
     top: 50%;
     transform: translateY(-50%)
 }

 .cssload-contain {
     height: 14px;
     width: 105px;
     margin: auto
 }

 .cssload-dot {
     float: left;
     height: 14px;
     width: 14px;
     border-radius: 50%;
     background-color: #6e0577;
     background-position: top center;
     margin: 0 3.5px;
     animation: cssload-bounce .52s infinite ease alternate;
     -o-animation: cssload-bounce .52s infinite ease alternate;
     -ms-animation: cssload-bounce .52s infinite ease alternate;
     -webkit-animation: cssload-bounce .52s infinite ease alternate;
     -moz-animation: cssload-bounce .52s infinite ease alternate
 }

 .cssload-dot:nth-child(1) {
     animation-delay: -90ms;
     -o-animation-delay: -90ms;
     -ms-animation-delay: -90ms;
     -webkit-animation-delay: -90ms;
     -moz-animation-delay: -90ms
 }

 .cssload-dot:nth-child(2) {
     animation-delay: -.17s;
     -o-animation-delay: -.17s;
     -ms-animation-delay: -.17s;
     -webkit-animation-delay: -.17s;
     -moz-animation-delay: -.17s
 }

 .cssload-dot:nth-child(3) {
     animation-delay: -.26s;
     -o-animation-delay: -.26s;
     -ms-animation-delay: -.26s;
     -webkit-animation-delay: -.26s;
     -moz-animation-delay: -.26s
 }

 .cssload-dot:nth-child(4) {
     animation-delay: -.35s;
     -o-animation-delay: -.35s;
     -ms-animation-delay: -.35s;
     -webkit-animation-delay: -.35s;
     -moz-animation-delay: -.35s
 }

 .cssload-dot:nth-child(5) {
     animation-delay: -.43s;
     -o-animation-delay: -.43s;
     -ms-animation-delay: -.43s;
     -webkit-animation-delay: -.43s;
     -moz-animation-delay: -.43s
 }

 .new {
     color: #f0ce16;
     font-size: 13px;
     font-weight: 400
 }

 .title-mega {
     font-size: 16px;
     color: #393939;
     font-weight: 600;
     padding-top: 5px;
     font-family: IRANSansX
 }

 .tab-single-blog {
     border-radius: 4px;
     background: #f8f8f8;
     border: solid #edf0f2 0;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31)
 }

 .tab-single-blog:hover {
     box-shadow: -1px 1px 15px -1px rgba(54, 54, 54, .6)
 }

 

 .pricing-table-box {
     padding: 0;
     margin: 0;
     margin-top: 10px;
     width: 100%;
     border-collapse: separate;
     border-spacing: .75px
 }

 .fourth-row,
 .second-row,
 .third-row {
     background: #fff
 }

 .pricing-table-box .pricing-table-box-list:nth-child(2n) td.second-row,
 .pricing-table-box .pricing-table-box-list:nth-child(2n) td.third-row,
 .pricing-table-box .pricing-table-box-list:nth-child(2n) td.fourth-row {
     background-color: #dedede
 }

 .pricing-table-box .pricing-table-box-item .pricing-table-box-item-head {
     background-image: linear-gradient(to left, #351080, #e6336c);
     padding: 12px 0;
     border-top-left-radius: 8px;
     border-top-right-radius: 25px
 }

 .pricing-table-box .pricing-table-box-item .pricing-table-box-item-head h4 {
     letter-spacing: .1px;
     color: #fff;
     text-align: center
 }

 .pricing-table-box .pricing-table-box-text h3 {
     text-align: center
 }

 .pricing-table-box .pricing-table-box-item .pricing-table-box-item-price p {
     font-size: 18px;
     text-align: center;
     padding: 15px 0;
     margin-bottom: 0;
     color: #1a1c1b
 }

 .pricing-table-box .pricing-table-box-list .fa-check {
     color: #68af27;
     font-size: 18px
 }

 .pricing-table-box .pricing-table-box-list .fa-times {
     color: #f73c3c;
     font-size: 18px
 }

 .pricing-table-box .pricing-table-box-item .pricing-table-box-item-price {
     text-align: center;
     background: #f9f6ff
 }

 .pricing-table-box .pricing-table-box-list td {
     padding: 18px 8px
 }

 .fourth-row,
 .second-row,
 .third-row {
     text-align: center
 }

 .table-responsive {
     border: 1px solid #dbdbdb;
     border-radius: 8px;
     box-shadow: rgba(0, 0, 0, .1) 0 0 5px 0, rgba(0, 0, 0, .1) 0 0 1px 0;
     background: #ffffff80;
     position: relative;
     overflow: hidden;
     overflow-x: auto;
     width: auto
 }

 .border-t {
     border-top: 1px solid #ddd
 }

 .color-educ {
     font-size: 23px;
     color: #6495ed
 }


 .z-index-20 {
     z-index: 20
 }

 .z-index-30 {
     z-index: 30
 }



 .saas-banner,
 .saas-banner-page {
     position: relative
 }

 .saas-image {
     height: 400px;
 }

 .saas-banner .saas-image img,
 .saas-banner-page .saas-image img {
     position: absolute;
     top: 0;
 }

 .saas-banner .saas-image img:last-child,
 .saas-banner-page .saas-image img:last-child {
     display: none
 }

 

 .width-20 {
     width: 20%
 }

 .width-30 {
     width: 30%
 }

 .color-cus1 {
     color: #8f0693
 }

 .contact-back {
     position: relative;
     background-image: url(../../image/contact/backboxleft-contactop.webp);
     background-size: 300px
 }

 .contact-left {
     position: relative;
     color: #fff;
     overflow: hidden;
     border-radius: 10px;
     background-image: url(../../image/contact/backboxleft-contact.webp);
     background-size: 550px;
     padding-right: 15px;
     padding-top: 20px;
     font-size: 16px
 }

 .contact-left::before {
     content: "";
     position: absolute;
     left: 0;
     width: 100%;
     height: 100%;
     background: #721c79;
     left: 0;
     bottom: 0;
     border-radius: 10px;
     opacity: .86
 }

 .contact-left h3 {
     color: #fff;
     line-height: 30px
 }

 .contact-left p {
     font-size: 14px;
     color: #fff
 }

 .contact-left hr {
     border-color: #fff;
     margin-left: 15px
 }

 .contact-left a {
     color: #fff
 }

 .box-contact {
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
     border-radius: 5px;
     background: #fff
 }
 .box-group {
     box-shadow: 0 3px 14px rgba(70, 10, 111, .29);
     border-radius: 5px;
     background: #fff;
     padding: 30px 36px;
 }

 .box-contact input {
     height: 40px
 }

 .box-contact .form-control {
     padding: 1em .5em
 }

 .btn-contact {
     color: #fff;
     font-size: 14px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 14px 26px;
     border-radius: 4px;
     transition: all 450ms ease-in-out;
     background: #067345;
     box-shadow: 0 2px 13px 3px #fff3;
     border: 0
 }

 .btn-contact:hover {
     background: #0e955c;
     color: #fff;
     border: 0
 }

 .info-title {
     opacity: 1;
     position: relative
 }

 .feature-container {
     position: relative
 }

 .icon-md {
     display: inline-block;
     text-align: center
 }

 .icon-md img {
     max-width: 100%;
     width: auto;
     height: 30px
 }

 .feature-bx4 {
     background-color: #fff;
     border-radius: 8px;
     padding: 15px;
     z-index: 1;
     overflow: hidden;
     box-shadow: 0 5px 30px 0 rgba(31, 34, 120, .08);
     border: 1px solid;
     border-color: red
 }

 

 .feature-bx4.feature2 {
     border-color: #f9ce24
 }

 .feature-bx4.feature2:after {
     background-color: #f9d95a7a
 }

 .feature-bx4.feature3 {
     border-color: #47f75b
 }

 .feature-bx4.feature3:after {
     background-color: #daf9d1
 }

 .feature-bx4.feature4 {
     border-color: #e2c4ff
 }

 .feature-bx4.feature4:after {
     background-color: #f3d1ff
 }

 .feature-bx4 .icon-content .ttr-title {
     color: #111;
     margin: 0 0 12px
 }

 .feature-bx4 .icon-content p {
     margin: 0
 }

.feature-bx4:hover::before {
    -webkit-animation: wobble .5s alternate;
    animation: wobble .5s alternate;
}

 .back-terms {
     background-size: 150px;
     background-image: url(../../imagenew/background/back-modal.svg)
 }

 .ltr {
     direction: ltr
 }

 #create-sharing input {
     padding: 8px;
     border-radius: 0;
     border: 1px solid #ab59afb3
 }

 #create-sharing input::placeholder {
     color: #959595 !important
 }

 #create-sharing .btn {
     background-color: #900c95d4;
     color: #fff;
     font-size: 12px;
     line-height: 1;
     font-weight: 500;
     letter-spacing: .5px;
     padding: 10px 12px;
     border: 2px solid transparent;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     -webkit-transition: all 450ms ease-in-out;
     -moz-transition: all 450ms ease-in-out;
     -o-transition: all 450ms ease-in-out;
     -ms-transition: all 450ms ease-in-out;
     transition: all 450ms ease-in-out
 }

 #create-sharing .btn:hover {
     background-color: #631366d4
 }

 #create-sharing span {
     border-radius: 0;
     border: 1px solid #ab59afb3;
     background: #eecaf7
 }

 #box-sharing-create {
     padding: 2px 30px;
     background: #fff;
     box-shadow: 0 5px 30px 0 rgb(181 157 181 / 32%)
 }

 #create-sharing .list-social .fab {
     line-height: 1.5 !important
 }

 #create-sharing .custom-control-label::before,
 #create-sharing .custom-control-label::after {
     top: .2rem;
     width: 20px;
     height: 20px
 }

 .opacity-6 {
     opacity: .6
 }

 .color-f {
     color: #3b5998
 }

 .color-t {
     color: #1da1f2
 }

 .color-l {
     color: #0e76a8
 }

 .color-p {
     color: #e60023
 }

 .mb-0 {
     margin-bottom: 0
 }

 .pt-30 {
     padding-top: 30px
 }

 .pt-20 {
     padding-top: 20px
 }

 .pb-20 {
     padding-bottom: 20px
 }

 .pb-10 {
     padding-bottom: 10px
 }

 .pb-0 {
     padding-bottom: 0
 }




 a {
     color: #554d63;
     text-decoration: none;
     -webkit-transition: all .4s ease-in-out;
     -moz-transition: all .4s ease-in-out;
     -o-transition: all .4s ease-in-out;
     -ms-transition: all .4s ease-in-out;
     transition: all .4s ease-in-out
 }

 a:hover {
     color: #666;
     text-decoration: none
 }

 a:focus {
     outline: 0;
     text-decoration: none
 }

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

 .section-title {
     text-align: center;
     margin-bottom: 35px
 }

 .section-title p {
     color: #535151;
     padding: 0 8%;
     margin-top: 16px;
     margin-bottom: 0
 }

 .red-color {
     color: #ef3f54
 }

 .blog-item-img {
     background: #fff
 }

 .work-single p {
     text-justify: inherit
 }





 .mega-menu .mega-menu-p a:hover {
     color: #6610f2 !important
 }

 .mega-menu .mega-menu-p a:hover:before {
     width: 80% !important
 }

 .highlight {
     position: fixed;
     width: 100vw;
     height: 0;
     background: rgba(250, 250, 250, .85);
     top: 0;
     left: 0;
     z-index: 100;
     transition: width .4s
 }

 .bar {
     height: 6px;
     width: 85px;
     background: #8f0693;
     margin: 12px auto 20px;
     position: relative;
     border-radius: 5px;
     overflow: hidden
 }

 .bar:before {
     content: "";
     position: absolute;
     left: 0;
     top: 0;
     height: 100%;
     width: 5px;
     background: #fff;
     animation-duration: 2s;
     -webkit-animation-timing-function: linear;
     animation-timing-function: linear;
     -webkit-animation-iteration-count: infinite;
     animation-iteration-count: infinite;
     -webkit-animation-name: MOVE-BG;
     animation-name: MOVE-BG
 }

 .barfooter {
     height: 4px;
     width: 80px;
     background: #8f0693;
     margin: 12px auto 20px;
     position: relative;
     border-radius: 5px;
     overflow: hidden
 }

 .barfooter:before {
     content: "";
     position: absolute;
     left: 0;
     top: 0;
     height: 100%;
     width: 5px;
     background: #fff;
     animation-duration: 2s;
     -webkit-animation-timing-function: linear;
     animation-timing-function: linear;
     -webkit-animation-iteration-count: infinite;
     animation-iteration-count: infinite;
     -webkit-animation-name: MOVE-BG;
     animation-name: MOVE-BG
 }



 .new {
     color: #f0ce16;
     font-size: 13px;
     font-weight: 400
 }



 .tab-single-blog {
     border-radius: 4px;
     background: #f8f8f8;
     border: solid #edf0f2 0;
     box-shadow: 0 1px 10px rgba(0, 0, 0, .31)
 }

 .tab-single-blog:hover {
     box-shadow: -1px 1px 15px -1px rgba(54, 54, 54, .6)
 }



 #loginModal input {
     font-size: 14px;
     border: 1px solid #cfcfcf;
     color: #86838d;
     padding: 10px 10px;
     height: 40px;
     font-weight: 400
 }

 .div-content-modal {
     padding: 12px 11px 0 11px;
     background: #fff;
     border-radius: 8px;
     box-shadow: rgba(0, 0, 0, .1) 0 0 5px 0, rgba(0, 0, 0, .1) 0 0 1px 0
 }

 .refresh-button {
     cursor: pointer;
     color: gray
 }

 .refresh-button:hover {
     color: #0b0b0b
 }

 .btn_google {
     padding-bottom: 4px;
     font-size: medium;
     font-weight: 700
 }

 .color-font {
     color: #554d63;
 }

 .btn-reg-modal {
     cursor: pointer;
     color: #fff;
     font-size: 14px;
     line-height: 1;
     font-weight: 400;
     letter-spacing: .4px;
     padding: 10px 25px;
     border-radius: 4px;
     transition: all 450ms ease-in-out;
     background: #0e3c95;
     box-shadow: 0 2px 13px 3px #fff3
 }

 .btn-reg-modal:hover {
     background: #1f66a4;
     color: #fff;
     border: 0
 }

 .close-modal {
     cursor: pointer;
     right: 94%;
     font-size: 20px
 }

 .border-t {
     border-top: 1px solid #ddd
 }

 .color-educ {
     font-size: 23px;
     color: #6495ed
 }

 .color-h3 {
     color: #7115b0;
     font-size: 18px
 }



 .saas-banner {
     position: relative;
     top: -15%
 }

 .saas-banner .saas-image img {
     position: absolute
 }

 .saas-banner .saas-image img:nth-child(1) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:nth-child(2) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:nth-child(3) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:nth-child(4) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:nth-child(5) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:nth-child(6) {
     left: 122px;
     top: 0;
     right: 10%
 }

 .saas-banner .saas-image img:last-child {
     display: none
 }

 .color-cus1 {
     color: #8f0693
 }

 .logo-text {
     font-size: 20px;
     font-weight: 600;
     color: #4b4b4c;
     margin-right: 8px;
 }

 @media (min-width:576px) {
     .container {
         max-width: 540px
     }

     .col-sm-6 {
         -ms-flex: 0 0 50%;
         flex: 0 0 50%;
         max-width: 50%
     }

     .col-sm-12 {
         
         flex: 0 0 100%;
         max-width: 100%
     }

     .flex-sm-column {
         -ms-flex-direction: column !important;
         flex-direction: column !important
     }

     .modal-dialog {
         max-width: 500px;
         margin: 1.75rem auto
     }
 }

 @media (min-width:768px) {
     .container {
         max-width: 720px
     }

     .col-md-2 {
         -ms-flex: 0 0 16.666667%;
         flex: 0 0 16.666667%;
         max-width: 16.666667%
     }

     .col-md-3 {
         -ms-flex: 0 0 25%;
         flex: 0 0 25%;
         max-width: 25%
     }

     .col-md-4 {
         -ms-flex: 0 0 33.333333%;
         flex: 0 0 33.333333%;
         max-width: 33.333333%
     }

     .col-md-5 {
         -ms-flex: 0 0 41.666667%;
         flex: 0 0 41.666667%;
         max-width: 41.666667%
     }

     .col-md-6 {
         -ms-flex: 0 0 50%;
         flex: 0 0 50%;
         max-width: 50%
     }

     .col-md-7 {
         -ms-flex: 0 0 58.333333%;
         flex: 0 0 58.333333%;
         max-width: 58.333333%
     }

     .col-md-8 {
         -ms-flex: 0 0 66.666667%;
         flex: 0 0 66.666667%;
         max-width: 66.666667%
     }

     .col-md-12 {
         
         flex: 0 0 100%;
         max-width: 100%
     }

     .col-md-auto {
         -ms-flex: 0 0 auto;
         flex: 0 0 auto;
         width: auto;
         max-width: 100%
     }

     .navbar-expand-md {
         -ms-flex-flow: row nowrap;
         flex-flow: row nowrap;
         -ms-flex-pack: start;
         justify-content: flex-start
     }

     .navbar-expand-md .navbar-nav {
         -ms-flex-direction: row;
         flex-direction: row
     }

     .navbar-expand-md .navbar-nav .dropdown-menu {
         position: absolute
     }

     .navbar-expand-md .navbar-nav .nav-link {
         padding-right: .5rem;
         padding-left: .5rem
     }

     .navbar-expand-md>.container {
         -ms-flex-wrap: nowrap;
         flex-wrap: nowrap
     }

     .navbar-expand-md .navbar-collapse {
         display: -ms-flexbox !important;
         display: flex !important;
         -ms-flex-preferred-size: auto;
         flex-basis: auto
     }

     .flex-md-row {
         -ms-flex-direction: row !important;
         flex-direction: row !important
     }
 }

 @media (min-width:992px) {
     .container {
         max-width: 960px
     }

     .col-lg-2 {
         -ms-flex: 0 0 16.666667%;
         flex: 0 0 16.666667%;
         max-width: 16.666667%
     }

     .col-lg-3 {
         -ms-flex: 0 0 25%;
         flex: 0 0 25%;
         max-width: 25%
     }

     .col-lg-4 {
         -ms-flex: 0 0 33.333333%;
         flex: 0 0 33.333333%;
         max-width: 33.333333%
     }

     .col-lg-5 {
         -ms-flex: 0 0 41.666667%;
         flex: 0 0 41.666667%;
         max-width: 41.666667%
     }

     .col-lg-6 {
         -ms-flex: 0 0 50%;
         flex: 0 0 50%;
         max-width: 50%
     }

     .col-lg-7 {
         -ms-flex: 0 0 58.333333%;
         flex: 0 0 58.333333%;
         max-width: 58.333333%
     }

     .col-lg-8 {
         -ms-flex: 0 0 66.666667%;
         flex: 0 0 66.666667%;
         max-width: 66.666667%
     }

     .col-lg-9 {
         -ms-flex: 0 0 75%;
         flex: 0 0 75%;
         max-width: 75%
     }

     .col-lg-12 {
         
         flex: 0 0 100%;
         max-width: 100%
     }

     .d-lg-block {
         display: block !important
     }

     .flex-lg-column {
         -ms-flex-direction: column !important;
         flex-direction: column !important
     }
 }

 @media (min-width:1200px) {
     .container {
         max-width: 1140px
     }

     @media (min-width:1400px) {
         .container {
             max-width: 1320px
         }
     }

     .col-xl-4 {
         -ms-flex: 0 0 33.333333%;
         flex: 0 0 33.333333%;
         max-width: 33.333333%
     }

     .offset-xl-1 {
         margin-left: 8.333333%
     }
 }

 @media (max-width:767.98px) {
     .navbar-expand-md>.container {
         padding-right: 0;
         padding-left: 0
     }
 }

 @media (max-width:768px) {
     .hero-txt p {
         font-size: 14.9px !important
     }

     .box-analyiz {
         margin-top: 50px !important
     }
 }

 @media (max-width:576px),
 (max-width:768px) {
     .pricing-table-box .pricing-table-box-item .pricing-table-box-item-head h4 {
         color: #fff;
         text-align: center;
         font-size: 16px
     }

     .pricing-table-box .pricing-table-box-text h3 {
         text-align: center;
         font-size: 18px
     }

     .pricing-table-box .pricing-table-box-item .pricing-table-box-item-price p {
         font-size: 14px;
         text-align: center;
         margin-bottom: 0;
         color: #1a1c1b
     }

     .pricing-table-box .pricing-table-box-list .fa-check {
         color: #68af27;
         font-size: 13px
     }
 }

 @media (prefers-reduced-motion:reduce) {

     .btn,
     .form-control,
     .custom-control-label:before {
         transition: none
     }

     .fade {
         transition: none
     }

     .modal.fade .modal-dialog {
         transition: none
     }
 }

 @media (max-width:576px) {
     .blog-item-single {
         text-align: right;
         width: 350px;
         margin: 15px auto
     }
 }

 .fotpost {
     align-items: center;
     width: 100%;
     min-height: 50px;
     border-top: 1px solid #eff3f7;
     padding: .9rem 1rem;
     bottom: 0;
     position: absolute;
     background: #403e3b0a
 }

 .line-top-modal {
     height: 6px;
     position: absolute;
     background: #b13dbb;
     top: 0;
     left: 0;
     content: " ";
     width: 100%;
     border-top-left-radius: 3px;
     border-top-right-radius: 3px
 }

 .pos-icon-modal {
     position: absolute;
     z-index: 2;
     top: 0;
     left: 0;
     display: block;
     width: 40px;
     height: 40px;
     text-align: center;
     line-height: 2.8
 }

 .close-modal {
     cursor: pointer;
     right: 94%;
     font-size: 20px
 }

 .blg_grid_caption {
     position: relative;
     display: block;
     padding: 1.2rem 1.2rem
 }

 fieldset {
     min-width: 0;
     padding: 0;
     margin: 0;
     border: 0
 }

 .cadre-google {
     box-shadow: rgba(0, 0, 0, .31) 0 0 5px 0, rgba(0, 0, 0, .4) 0 0 1px 0;
     border-radius: 3px;
     margin: 0;
     padding: 12px 0
 }

 .back_google {
     display: inline-block
 }

 .he_boxblog {
     max-height: 300px;
     min-height: 270px
 }

 .fotpost_first {
     align-content: center;
     align-items: center;
     display: flex;
     flex: 1
 }

 .date {
     margin-right: 5px;
     font-weight: 500;
     font-size: 14px;
     margin-top: 5px
 }

 .text_box_post {
     font-size: 15px
 }

 .tagcat {
     font-size: 14px;
     font-weight: 600;
     color: #972068
 }

 .r_icon_date {
     width: 30px;
     height: 30px;
     align-items: center;
     justify-content: center;
     display: flex;
     background: #ffffff;
     border: 1px solid #dcdddf;
     border-radius: 50%;
     font-size: 14px
 }

 .r_icon_date i {
     color: #ef7c1f
 }

 .g-box2 .p-h5 {
     font-size: 18px;
     font-weight: 600
 }

 .blg_grid_caption h3 {
     font-size: 18px;
     line-height: 1.5
 }

 .align-items-center {
     -webkit-box-align: center !important;
     -webkit-align-items: center !important;
     -moz-box-align: center !important;
     -ms-flex-align: center !important;
     align-items: center !important
 }

 .crice1 {
     position: relative
 }

 .crice1::after {
     background-color: rgb(242, 244, 280);
     border-top-style: solid;
     border-top-width: 0;
     bottom: 0;
     color: rgb(51, 51, 53);
     content: "";
     inset-inline-start: 14px;
     line-height: 19.5167px;
     position: absolute;
     tab-size: 4;
     text-align: start;
     top: 28px;
     width: 1px
 }

 .crice2 {
     position: relative;
     display: flex;
     width: 1.75rem;
     height: 1.75rem;
     align-items: center;
     justify-content: center
 }

 .crice3 {
     background-color: rgb(32, 201, 151);
     border: 0 solid #6adbb9;
     width: .5rem;
     height: .5rem;
     border-radius: 9999px;
     box-shadow: rgba(88, 210, 63, .34) 5px 0 5px 0
 }

 .justify-content-between {
     -ms-flex-pack: justify !important;
     justify-content: space-between !important
 }

 .table-responsive {
     display: block;
     width: 100%;
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
     -ms-overflow-style: -ms-autohiding-scrollbar
 }

 .w-video {
     height: auto;
     justify-items: center;
     display: inline-grid
 }

 .fit-video {
     height: 100%;
     object-fit: cover
 }

 video {
     max-width: 100%;
     height: auto
 }

 #pricings span,
 #pricingssocial span {
     font-size: 16px;
     font-weight: 400
 }

 .item-price {
     overflow: hidden;
     background: #fff;
     border-radius: .7em;
     padding: 12px;
     -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     z-index: 1;
     color: black;
     cursor: pointer;
     border-style: solid;
     border-width: .3px;
     border-color: #d7d7d7
 }

 .item-price:hover {
     background: #ecd9b5;
     color: black
 }

 .item-price-active {
     color: #fff;
     background: #f59348;
     border-style: none
 }

 .fontiran {
     color: #4b4a4a !important;
     font-family: IRANSansX !important;
     font-weight: 600 !important;
     letter-spacing: -.3px;
     font-size: 24px !important
 }

 .pr-icon {
     display: inline-block;
     position: absolute;
     width: 30px;
     height: 30px;
     background-size: 30px;
     top: 8px;
     left: 30px
 }

 .p-help {
     display: inline-block;
     font-weight: 600;
     padding: 3px 11px;
     width: fit-content;
     background: white;
     color: #bf0964;
     -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
     box-shadow: 0 0 20px 0 rgb(223, 187, 208);
     border-style: solid;
     border-width: .3px;
     border-color: #e89fcb
 }

.feature-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-size: 45px;
      background-position-x: 98%;
      background-position-y: 50%;
      opacity: 0.3;
      z-index: -1;
      pointer-events: none;
      
}
 .head-share[data-loaded="true"]::before {
     background-image: url('../../imagenew/sharingwebp/before-share.webp') !important;
     background-repeat: no-repeat;
     background-position: 90% 100%;
     opacity: 55%
 }

 .head-share[data-loaded="true"]::after {
     background-image: url('../../imagenew/sharingwebp/after-share.webp') !important;
     background-repeat: no-repeat;
     background-position: 0;
     opacity: 40%
 }

 .img-box {
     position: relative;
     background: linear-gradient(to bottom, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.26) 5%, rgba(255, 255, 255, 0) 80%, rgb(255, 255, 255) 100%), linear-gradient(to left, rgb(255, 255, 255) 1%, rgba(255, 255, 255, 0.26) 6%, rgba(255, 255, 255, 0) 96%, rgb(255, 255, 255) 100%), linear-gradient(to left, #351080, #e6336c);
     box-sizing: border-box;
     height: inherit;
 }
.text-box-r{
    height: inherit;
}
.text-box-l{
    height: inherit;
}
.text-box-center{
    height: inherit;
}
 .img-box::before {
     content: "";
     position: absolute;
     top: -10px;
     right: -5px;
     width: 100%;
     height: calc(100% + 5px);
     border: 2px dashed #5e2d97c2;
     border-radius: 8px;
     background: transparent;
 }

 .text-box-r::after {
     content: "";
     position: absolute;
     top: 40px;
     right: 10px;
     width: 48%;
     height: calc(100% - 60px);
     border-radius: 8px;
     background: #eaf0ff70;
     z-index: -1;
     border-width: 0.8px;
     border-color: #edeaff96;
 }

 .text-box-r::before {
     content: "";
     position: absolute;
     top: 10px;
     right: 0;
     width: 48%;
     height: 100%;
     border-radius: 8px;
     border: 1.9px dashed #cfabff;
     z-index: 0;
     background: transparent;
 }
  .text-box-center::after {
     content: "";
     position: absolute;
     top: 40px;
     right: 10px;
     width: 100%;
     height: 100%;
     border-radius: 8px;
     background: #eaf0ff70;
     z-index: -1;
     border-width: 0.8px;
     border-color: #edeaff96;
 }

 .text-box-center::before {
     content: "";
     position: absolute;
     top: 10px;
     right: 10px;
     width: 95%;
     height: 100%;
     border-radius: 8px;
     border: 1.9px dashed #cfabff;
     z-index: 0;
     background: transparent;
 }

 .text-box-l::after {
     content: "";
     position: absolute;
     top: 25px;
     right: 54%;
     width: 48%;
     height: calc(100% - 60px);
     border-radius: 8px;
     background: #eaf0ff70;
     z-index: -1;
     border-width: 0.8px;
     border-color: #edeaff96;
 }

 .text-box-l::before {
     content: "";
     position: absolute;
     top: 0;
     right: 55%;
     width: 50%;
     height: 100%;
     border-radius: 8px;
     border: 1.9px dashed #cfabff;
     z-index: 0;
     background: transparent;
 }

 @media (min-width: 768px) {
     /* .container {
    max-width: 768px;
  } */
 }

 @media only screen and (max-width:767px) {
     .head-share[data-loaded="true"]::before {
         background-image: none !important
     }

     .text-box-r::after {
         content: "";
         position: absolute;
         top: 20px;
         right: 15px;
         width: 90%;
         height: 100%;
         border-radius: 8px;
         background: #eaf0ff70;
         z-index: -1;
         border-width: 0.8px;
         border-color: #edeaff96;
     }

     .text-box-r::before {
         content: "";
         position: absolute;
         top: 0;
         right: 10px;
         width: 95%;
         height: 100%;
         border-radius: 8px;
         border: 1.9px dashed #cfabff;
         z-index: 0;
         background: transparent;
     }

     .text-box-l::after {
         content: "";
         position: absolute;
         top: 30px;
         right: 10px;
         width: 90%;
         height: 300px;
         border-radius: 8px;
         background: #eaf0ff70;
         z-index: -1;
         border-width: 0.8px;
         border-color: #edeaff96;
     }

     .text-box-l::before {
         content: "";
         position: absolute;
         top: 0;
         right: 10px;
         width: 95%;
         height: 300px;
         border-radius: 8px;
         border: 1.9px dashed #cfabff;
         z-index: 0;
         background: transparent;
     }
 }

 .shared-head p {
     text-align: center
 }

 .our-process-area .shared-box1,
 .our-process-area .shared-box2,
 .our-process-area .shared-box3,
 .our-process-area .shared-box4 {
     height: 100px;
     width: 100px;
     background-repeat: no-repeat;
     margin: 0 auto;
     margin-bottom: 10px
 }

 .our-process-area .shared-box1 {
     background-image: url(../../imagenew/seotoolswebp/facebook-box.webp)
 }

 .our-process-area .shared-box2 {
     background-image: url(../../imagenew/seotoolswebp/linkedin-box.webp)
 }

 .our-process-area .shared-box3 {
     background-image: url(../../imagenew/seotoolswebp/twitter-box.webp)
 }

 .our-process-area .shared-box4 {
     background-image: url(../../imagenew/seotoolswebp/pinterest-box.webp)
 }
#goftino_w{
    right: 20px !important;
}
 .go-top {
     position: fixed;
     top: 50%;
     left: 2%;
     opacity: 0;
     cursor: pointer;
     text-decoration: none;
     color: #fff;
     font-size: 12px;
     font-weight: 700;
     text-align: center;
     background: #ee7c22c7;
     border-radius: 5px;
     border: 0 solid #fff;
     padding: 5px 12px;
     z-index: 100;
     -webkit-transition: all .5s ease-in-out;
     transition: all .5s ease-in-out
 }

 .go-top.active {
     top: 95%;
     -webkit-transform: translateY(-95%);
     transform: translateY(-95%);
     opacity: 1;
     visibility: visible
 }
 #info-con h4{
     font-size : 16px;
 }

 @media all {
     .fab {
         font-family: 'Font Awesome 5 Brands';
         font-weight: 400
     }

     .fa,
     .fas {
         font-family: fa-solid;
         font-weight: 900
     }

     .fa,
     .fab,
     .fas {
         -moz-osx-font-smoothing: grayscale;
         -webkit-font-smoothing: antialiased;
         display: inline-block;
         font-style: normal;
         font-variant: normal;
         text-rendering: auto;
         line-height: 1;
         vertical-align: middle
     }

     .fa-lg {
         font-size: 1.33333em;
         line-height: .75em;
         vertical-align: -.0667em
     }

     .fa-2x {
         font-size: 2em
     }

     .fa-home:before {
         content: "\f015"
     }

     .fa-angle-right:before {
         content: "\f105"
     }

     .fa-fingerprint:before {
         content: "\f577"
     }

     .fa-key:before {
         content: "\f084"
     }

     .fa-pen-fancy:before {
         content: "\f5ac"
     }

     .fa-facebook-f:before,
     .fa-facebook:before {
         content: "\f39e"
     }

     .fa-pinterest:before,
     .fa-pinterest-p:before {
         content: "\f0d2"
     }

     .fa-telegram-plane:before,
     .fa-telegram:before {
         content: "\f3fe"
     }

     .fa-twitter:before,
     .fa-twitter-square:before {
         content: "\f099"
     }

     .fa-linkedin-in:before,
     .fa-linkedin:before {
         content: "\f0e1"
     }

     .fa-calendar-alt:before,
     .fa-calendar:before {
         content: "\f073"
     }

     .fa-map-marker-alt:before {
         content: "\f3c5"
     }

     .fa-phone-square:before,
     .fa-phone:before {
         content: "\f098"
     }

     .fa-envelope:before,
     .fa-at:before {
         content: "\f0e0"
     }

     .fa-youtube:before {
         content: "\f167"
     }

     .fa-instagram:before {
         content: "\f16d"
     }

     .fa-whatsapp:before {
         content: "\f232"
     }

     .fa-chevron-up:before {
         content: "\f077"
     }

     .fa-meteor:before {
         content: "\f753"
     }

     .fa-leanpub:before {
         content: "\f212"
     }

     .fa-times:before {
         content: "\f00d"
     }

     .fa-sign-in-alt:before {
         content: "\f2f6"
     }

     .fa-mouse-pointer:before {
         content: "\f245"
     }

     .fa-list-ol:before {
         content: "\f0cb"
     }

     .fa-tasks:before {
         content: "\f0ae"
     }

     .fa-check:before {
         content: "\f00c"
     }

     .fa-times:before {
         content: "\f00d"
     }

     .fa-sync-alt:before {
         content: "\f2f1"
     }

     .fa-file-alt:before {
         content: "\f15c"
     }

     .fa-globe:before {
         content: "\f0ac"
     }

     .fa-file-word:before {
         content: "\f1c2"
     }

     .fa-image:before {
         content: "\f03e"
     }

     .fa-check-circle:before {
         content: "\f058"
     }
 }

 @media all {
     .fadeInUp {
         -webkit-animation-name: fadeInUp;
         animation-name: fadeInUp
     }

     .pulse {
         -webkit-animation-name: pulse;
         animation-name: pulse
     }

     .bounceIn {
         animation-duration: .75s;
         -webkit-animation-name: bounceIn;
         animation-name: bounceIn
     }

     .bounceInDown {
         -webkit-animation-name: bounceInDown;
         animation-name: bounceInDown
     }

     .bounceInLeft {
         -webkit-animation-name: bounceInLeft;
         animation-name: bounceInLeft
     }

     .bounceInRight {
         -webkit-animation-name: bounceInRight;
         animation-name: bounceInRight
     }

     .bounceInUp {
         -webkit-animation-name: bounceInUp;
         animation-name: bounceInUp
     }

     .lightSpeedIn {
         -webkit-animation-name: lightSpeedIn;
         animation-name: lightSpeedIn;
         -webkit-animation-timing-function: ease-out;
         animation-timing-function: ease-out
     }

     .rollIn {
         -webkit-animation-name: rollIn;
         animation-name: rollIn
     }

     .zoomIn {
         -webkit-animation-name: zoomIn;
         animation-name: zoomIn
     }

     .animated {
         animation-duration: 1s;
         -webkit-animation-fill-mode: both;
         animation-fill-mode: both
     }
 }

 @-webkit-keyframes rotating {
     from {
         -webkit-transform: rotate(0);
         -o-transform: rotate(0);
         transform: rotate(0)
     }

     to {
         -webkit-transform: rotate(360deg);
         -o-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }

 @keyframes rotating {
     from {
         -ms-transform: rotate(0);
         -moz-transform: rotate(0);
         -webkit-transform: rotate(0);
         -o-transform: rotate(0);
         transform: rotate(0)
     }

     to {
         -ms-transform: rotate(360deg);
         -moz-transform: rotate(360deg);
         -webkit-transform: rotate(360deg);
         -o-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }

 @-webkit-keyframes MOVE-BG {
     from {
         -webkit-transform: translateX(0);
         transform: translateX(0)
     }

     to {
         -webkit-transform: translateX(85px);
         transform: translateX(85px)
     }
 }

 @keyframes MOVE-BG {
     from {
         -webkit-transform: translateX(0);
         transform: translateX(0)
     }

     to {
         -webkit-transform: translateX(85px);
         transform: translateX(85px)
     }
 }

 @keyframes cssload-bounce {
     0% {
         transform: translateY(0);
         box-shadow: 0 3.5px 1px rgba(71, 34, 86, .2)
     }

     100% {
         transform: translateY(-55px);
         box-shadow: 0 124px 17px rgba(0, 0, 0, .1)
     }
 }

 @-webkit-keyframes cssload-bounce {
     0% {
         -webkit-transform: translateY(0);
         box-shadow: 0 3.5px 1px rgba(71, 34, 86, .2)
     }

     100% {
         -webkit-transform: translateY(-55px);
         box-shadow: 0 124px 17px rgba(0, 0, 0, .1)
     }
 }

 @-moz-keyframes cssload-bounce {
     0% {
         -moz-transform: translateY(0);
         box-shadow: 0 3.5px 1px rgba(71, 34, 86, .2)
     }

     100% {
         -moz-transform: translateY(-55px);
         box-shadow: 0 124px 17px rgba(0, 0, 0, .1)
     }
 }

 @-webkit-keyframes pulse {
     from {
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }

     50% {
         -webkit-transform: scale3d(1.05, 1.05, 1.05);
         transform: scale3d(1.05, 1.05, 1.05)
     }

     to {
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }
 }

 @keyframes pulse {
     from {
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }

     50% {
         -webkit-transform: scale3d(1.05, 1.05, 1.05);
         transform: scale3d(1.05, 1.05, 1.05)
     }

     to {
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }
 }

 @-webkit-keyframes bounceIn {

     20%,
     40%,
     60%,
     80%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: scale3d(.3, .3, .3);
         transform: scale3d(.3, .3, .3)
     }

     20% {
         -webkit-transform: scale3d(1.1, 1.1, 1.1);
         transform: scale3d(1.1, 1.1, 1.1)
     }

     40% {
         -webkit-transform: scale3d(.9, .9, .9);
         transform: scale3d(.9, .9, .9)
     }

     60% {
         opacity: 1;
         -webkit-transform: scale3d(1.03, 1.03, 1.03);
         transform: scale3d(1.03, 1.03, 1.03)
     }

     80% {
         -webkit-transform: scale3d(.97, .97, .97);
         transform: scale3d(.97, .97, .97)
     }

     to {
         opacity: 1;
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }
 }

 @keyframes bounceIn {

     20%,
     40%,
     60%,
     80%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: scale3d(.3, .3, .3);
         transform: scale3d(.3, .3, .3)
     }

     20% {
         -webkit-transform: scale3d(1.1, 1.1, 1.1);
         transform: scale3d(1.1, 1.1, 1.1)
     }

     40% {
         -webkit-transform: scale3d(.9, .9, .9);
         transform: scale3d(.9, .9, .9)
     }

     60% {
         opacity: 1;
         -webkit-transform: scale3d(1.03, 1.03, 1.03);
         transform: scale3d(1.03, 1.03, 1.03)
     }

     80% {
         -webkit-transform: scale3d(.97, .97, .97);
         transform: scale3d(.97, .97, .97)
     }

     to {
         opacity: 1;
         -webkit-transform: scale3d(1, 1, 1);
         transform: scale3d(1, 1, 1)
     }
 }

 @-webkit-keyframes bounceInDown {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: translate3d(0, -3000px, 0);
         transform: translate3d(0, -3000px, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(0, 25px, 0);
         transform: translate3d(0, 25px, 0)
     }

     75% {
         -webkit-transform: translate3d(0, -10px, 0);
         transform: translate3d(0, -10px, 0)
     }

     90% {
         -webkit-transform: translate3d(0, 5px, 0);
         transform: translate3d(0, 5px, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes bounceInDown {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: translate3d(0, -3000px, 0);
         transform: translate3d(0, -3000px, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(0, 25px, 0);
         transform: translate3d(0, 25px, 0)
     }

     75% {
         -webkit-transform: translate3d(0, -10px, 0);
         transform: translate3d(0, -10px, 0)
     }

     90% {
         -webkit-transform: translate3d(0, 5px, 0);
         transform: translate3d(0, 5px, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes bounceInLeft {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: translate3d(-3000px, 0, 0);
         transform: translate3d(-3000px, 0, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(25px, 0, 0);
         transform: translate3d(25px, 0, 0)
     }

     75% {
         -webkit-transform: translate3d(-10px, 0, 0);
         transform: translate3d(-10px, 0, 0)
     }

     90% {
         -webkit-transform: translate3d(5px, 0, 0);
         transform: translate3d(5px, 0, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes bounceInLeft {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     0% {
         opacity: 0;
         -webkit-transform: translate3d(-3000px, 0, 0);
         transform: translate3d(-3000px, 0, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(25px, 0, 0);
         transform: translate3d(25px, 0, 0)
     }

     75% {
         -webkit-transform: translate3d(-10px, 0, 0);
         transform: translate3d(-10px, 0, 0)
     }

     90% {
         -webkit-transform: translate3d(5px, 0, 0);
         transform: translate3d(5px, 0, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes bounceInRight {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     from {
         opacity: 0;
         -webkit-transform: translate3d(3000px, 0, 0);
         transform: translate3d(3000px, 0, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(-25px, 0, 0);
         transform: translate3d(-25px, 0, 0)
     }

     75% {
         -webkit-transform: translate3d(10px, 0, 0);
         transform: translate3d(10px, 0, 0)
     }

     90% {
         -webkit-transform: translate3d(-5px, 0, 0);
         transform: translate3d(-5px, 0, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes bounceInRight {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     from {
         opacity: 0;
         -webkit-transform: translate3d(3000px, 0, 0);
         transform: translate3d(3000px, 0, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(-25px, 0, 0);
         transform: translate3d(-25px, 0, 0)
     }

     75% {
         -webkit-transform: translate3d(10px, 0, 0);
         transform: translate3d(10px, 0, 0)
     }

     90% {
         -webkit-transform: translate3d(-5px, 0, 0);
         transform: translate3d(-5px, 0, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes bounceInUp {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     from {
         opacity: 0;
         -webkit-transform: translate3d(0, 3000px, 0);
         transform: translate3d(0, 3000px, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(0, -20px, 0);
         transform: translate3d(0, -20px, 0)
     }

     75% {
         -webkit-transform: translate3d(0, 10px, 0);
         transform: translate3d(0, 10px, 0)
     }

     90% {
         -webkit-transform: translate3d(0, -5px, 0);
         transform: translate3d(0, -5px, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes bounceInUp {

     60%,
     75%,
     90%,
     from,
     to {
         -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
         animation-timing-function: cubic-bezier(.215, .61, .355, 1)
     }

     from {
         opacity: 0;
         -webkit-transform: translate3d(0, 3000px, 0);
         transform: translate3d(0, 3000px, 0)
     }

     60% {
         opacity: 1;
         -webkit-transform: translate3d(0, -20px, 0);
         transform: translate3d(0, -20px, 0)
     }

     75% {
         -webkit-transform: translate3d(0, 10px, 0);
         transform: translate3d(0, 10px, 0)
     }

     90% {
         -webkit-transform: translate3d(0, -5px, 0);
         transform: translate3d(0, -5px, 0)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes fadeInUp {
     from {
         opacity: 0;
         -webkit-transform: translate3d(0, 100%, 0);
         transform: translate3d(0, 100%, 0)
     }

     to {
         opacity: 1;
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes fadeInUp {
     from {
         opacity: 0;
         -webkit-transform: translate3d(0, 100%, 0);
         transform: translate3d(0, 100%, 0)
     }

     to {
         opacity: 1;
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes lightSpeedIn {
     from {
         -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
         transform: translate3d(100%, 0, 0) skewX(-30deg);
         opacity: 0
     }

     60% {
         -webkit-transform: skewX(20deg);
         transform: skewX(20deg);
         opacity: 1
     }

     80% {
         -webkit-transform: skewX(-5deg);
         transform: skewX(-5deg)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes lightSpeedIn {
     from {
         -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
         transform: translate3d(100%, 0, 0) skewX(-30deg);
         opacity: 0
     }

     60% {
         -webkit-transform: skewX(20deg);
         transform: skewX(20deg);
         opacity: 1
     }

     80% {
         -webkit-transform: skewX(-5deg);
         transform: skewX(-5deg)
     }

     to {
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes rollIn {
     from {
         opacity: 0;
         -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
         transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
     }

     to {
         opacity: 1;
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @keyframes rollIn {
     from {
         opacity: 0;
         -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
         transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
     }

     to {
         opacity: 1;
         -webkit-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
     }
 }

 @-webkit-keyframes zoomIn {
     from {
         opacity: 0;
         -webkit-transform: scale3d(.3, .3, .3);
         transform: scale3d(.3, .3, .3)
     }

     50% {
         opacity: 1
     }
 }

 @keyframes zoomIn {
     from {
         opacity: 0;
         -webkit-transform: scale3d(.3, .3, .3);
         transform: scale3d(.3, .3, .3)
     }

     50% {
         opacity: 1
     }
 }

@keyframes wobble {
    0% {
        transform: translateX(0) rotate(0deg);
    }
    25% {
        transform: translateX(-3px) rotate(-2deg);
    }
    75% {
        transform: translateX(3px) rotate(2deg);
    }
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

 @keyframes slideInDown {
     from {
         transform: translate3d(0, -100%, 0);
         visibility: visible
     }

     to {
         transform: translate3d(0, 0, 0)
     }
 }

 @font-face {
     font-family: fa-solid;
     font-style: normal;
     font-weight: 900;
     font-display: swap;
     src: url('../../new-font/font-icon/fa-solid-900.eot');
     src: url('../../new-font/font-icon/fa-solid-900.eot') format("embedded-opentype"), url('../../new-font/font-icon/fa-solid-900.woff2') format("woff2"), url('../../new-font/font-icon/fa-solid-900.woff') format("woff"), url('../../new-font/font-icon/fa-solid-900.ttf') format("truetype")
 }

 @font-face {
     font-family: IRANSansX;
     font-display: swap;
     font-style: normal;
     font-weight: bold;
     src: url('../../new-font/textfont/sans/IRANSansX-Bold.woff2') format('woff2');
     -moz-font-feature-settings: "ss02";
     -webkit-font-feature-settings: "ss02";
     font-feature-settings: "ss02"
 }

 @font-face {
     font-family: IRANSansX;
     font-display: swap;
     font-style: normal;
     font-weight: normal;
     src: url('../../new-font/textfont/sans/IRANSansX-Regular.woff2') format('woff2');
     -moz-font-feature-settings: "ss02";
     -webkit-font-feature-settings: "ss02";
     font-feature-settings: "ss02"
 }

 @font-face {
     font-family: 'Font Awesome 5 Brands';
     font-style: normal;
     font-weight: 400;
     font-display: swap;
     src: url('../../new-font/font-icon/fa-brands-400.eot');
     src: url('../../new-font/font-icon/fa-brands-400.eot') format("embedded-opentype"), url('../../new-font/font-icon/fa-brands-400.woff2') format("woff2"), url('../../new-font/font-icon/fa-brands-400.woff') format("woff"), url('../../new-font/font-icon/fa-brands-400.ttf') format("truetype")
 }