/* initial styles */
@import url(font.css);

:root {
   --primary: #0101FD;
   --secondary: #B6FCE4;
   --danger: #FF0100;
   --dark: #292A41;
   --second_dark: #444444;
   --light: #fff;
   --light_gray: #CDDDEC;
   --gray: #929292;
   --green: #52D2AE;
   --second-gray: #EBEBEB;
   --third-gray: #FCFCFC
}

body {
   color: var(--dark);
   background-color: var(--third-gray);
   overflow-x: hidden;
}

body.overflow-hidden {
   overflow: hidden;
}

.search-holder form {
   display: flex;
   width: 100%;
}

a {
   display: inline-block;
   color: var(--primary);
   text-decoration: none;
   position: relative;
   transition: all 0.25s ease-in-out;
}

p {
   margin: 0;
   text-align: justify;
}

a:hover {
   color: var(--danger);
}

input[type="email"]::placeholder,
input[type="tel"]::placeholder {
   text-align: right;
}

::-webkit-scrollbar {
   width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
   background: var(--light_gray);
   border-radius: 5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
   background: var(--gray);
   border-radius: 5px;
   transition: all 0.25s ease;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
   background: #6b6767;
}

.mb-40 {
   margin-bottom: 2.5rem;
}

.text-left {
   text-align: left;
}

.font-small {
   font-size: 0.875rem;
}

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

.base-card {
   background-color: var(--light);
   border-radius: 16px;
   padding: 1.875rem;
}

.base-card .card-title {
   font-family: Rokh;
   font-size: 1.75rem;
   margin-bottom: 2.75rem;
   font-weight: bold;
}

.color-primary {
   color: var(--primary);
}

.color-danger {
   color: var(--danger);
}

.text-medium {
   font-weight: 500;
}

.text-small {
   font-size: 0.875rem;
}

.ar-btn {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   border: none;
   flex-direction: column;
}

.ar-btn.btn-small a {
   padding: 0 0.75rem;
   line-height: 2.25rem;
   font-size: 0.875rem;
}

.ar-btn.btn-x-small a {
   padding: 0 0.75rem;
   line-height: 1.5rem;
   font-size: 0.75rem;
}

.ar-btn svg {
   display: none;
}

.ar-btn>a,
.ar-btn>button {
   line-height: 3rem;
   border-radius: 24px;
   padding: 0 1.5rem;
   position: relative;
   z-index: 1;
   display: inline-flex;
   align-items: center;
   font-weight: 500;
   border: none;
   transition: all 0.25s ease-in-out;
}

.ar-btn>a small,
.ar-btn>button small {
   font-size: 0.75rem;
   margin-right: 0.25rem;
}

.ar-btn.border-btn>a,
.ar-btn.border-btn>button {
   padding: 0;
   border-radius: 0;
   line-height: normal;
   border-bottom: 1px solid transparent;
}

.ar-btn.border-btn>a:hover,
.ar-btn.border-btn>button:hover {
   transform: translateY(-2px) scale(1.1);
}

.ar-btn.border-btn>a>.icon {
   margin-left: 0.375rem;
}

.ar-btn.border-btn.border-primary>a,
.ar-btn.border-btn.border-primary>button {
   color: var(--green);
   border-color: var(--green);
}

.ar-btn.border-btn.border-dark>a,
.ar-btn.border-btn.border-dark>button {
   color: var(--second_dark);
   border-color: var(--second_dark);
}

.ar-btn.ar-primary>a,
.ar-btn.ar-primary>button {
   color: var(--dark);
   background-color: var(--secondary);
}

.ar-btn.ar-primary>a:hover,
.ar-btn.ar-primary>button:hover {
   color: var(--light);
}

.ar-btn>a .blob-btn__inner,
.ar-btn>button .blob-btn__inner {
   z-index: -1;
   overflow: hidden;
   position: absolute;
   left: 0px;
   top: 0px;
   width: 100%;
   height: 100%;
   border-radius: 30px;
   transform: scale(1.02);
}

.ar-btn>a .blob-btn__blobs,
.ar-btn>button .blob-btn__blobs {
   position: relative;
   display: block;
   height: 100%;
   filter: url(#goo);
}

.ar-btn>a .blob-btn__blob,
.ar-btn>button .blob-btn__blob {
   position: absolute;
   top: 2px;
   width: 25%;
   height: 100%;
   border-radius: 100%;
   transform: scale(1.7);
   top: 150%;
   transition: all 0.45s;
}

.ar-btn.ar-primary>a .blob-btn__blob,
.ar-btn.ar-primary>button .blob-btn__blob {
   background-color: var(--primary);
}

@supports (filter: url('#goo')) {
   .blob-btn__blob {
      transform: scale(1.4);
   }
}

.ar-btn>a .blob-btn__blob:nth-child(1),
.ar-btn>button .blob-btn__blob:nth-child(1) {
   left: 0%;
   transition-delay: 0s;
}

.ar-btn>a .blob-btn__blob:nth-child(2),
.ar-btn>button .blob-btn__blob:nth-child(2) {
   left: 30%;
   transition-delay: 0.08s;
}

.ar-btn>a .blob-btn__blob:nth-child(3),
.ar-btn>button .blob-btn__blob:nth-child(3) {
   left: 60%;
   transition-delay: 0.16s;
}

.ar-btn>a .blob-btn__blob:nth-child(4),
.ar-btn>button .blob-btn__blob:nth-child(4) {
   left: 90%;
   transition-delay: 0.24s;
}

.ar-btn>a:hover .blob-btn__blob,
.ar-btn>button:hover .blob-btn__blob {
   transform: scale(1.7);
   top: 0;
}


@supports (filter: url('#goo')) {

   .ar-btn>a:hover .blob-btn__blob,
   .ar-btn>button:hover .blob-btn__blob {
      transform: scale(1.4);
      top: 0;
   }
}

.ar-btn>a .icon-holder,
.ar-btn>button .icon-holder {
   width: 2.5rem;
   height: 2.5rem;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   border-radius: 50%;
   background-color: var(--light);
}

.ar-btn.ar-solid>a .icon-holder,
.ar-btn.ar-solid>button .icon-holder {
   border: 1px solid var(--secondary);
}

.ar-btn>a.icon-right .icon-holder,
.ar-btn>button.icon-right .icon-holder {
   margin-left: 0.75rem;
}

.ar-btn>a.icon-left .icon-holder,
.ar-btn>button.icon-left .icon-holder {
   margin-right: 0.75rem;
}

.ar-btn>a.icon-right,
.ar-btn>button.icon-right {
   padding-right: 0.25rem;
}

.ar-btn>a.icon-left,
.ar-btn>button.icon-left {
   padding-left: 0.25rem;
}

.group-btn {
   display: flex;
}

.group-btn .ar-btn:not(:last-child),.group-btn .module-btn {
    margin-left: 1rem;
}

.ar-btn.ar-solid>a,
.ar-btn.ar-solid>button {
   background-color: var(--light);
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
}

.ar-btn.ar-secondary>a,
.ar-btn.ar-secondary>button {
   background-color: var(--primary);
   color: var(--light);
}

.ar-btn.ar-solid>a .blob-btn__blob,
.ar-btn.ar-solid>button .blob-btn__blob {
   background-color: var(--primary);
}

.ar-btn.ar-secondary>a .blob-btn__blob,
.ar-btn.ar-secondary>button .blob-btn__blob {
   background-color: var(--secondary);
}

.ar-btn.ar-solid>a:hover,
.ar-btn.ar-solid>button:hover {
   color: var(--light);
}

.sec-title {
   font-family: Rokh;
   font-weight: 900;
   font-size: 2.5rem;
}

.sec-title span {
   font-size: 2.75rem;
   color: var(--primary);
}

.pl-12 {
   padding-left: 12rem;
}

/* /initial styles */

/* icon */

.ar-btn.ar-primary .icon {
   color: var(--green);
}

.ar-btn.ar-secondary .icon {
   color: var(--primary);
}

.ar-btn.ar-solid .icon {
   color: var(--green);
}

.ar-btn.ar-primary a:hover .icon {
   color: var(--primary);
}

.ar-btn.ar-secondary a:hover .icon {
   color: var(--secondary);
}

.ar-btn.ar-solid button:hover .icon {
   color: var(--primary);
}

/* /icon */

/* header section */

header {
   background-color: var(--light);
}

.main-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 0.75rem 0;
}

.main-header .logo-holder {
   display: inline-block;
   max-width: 7.25rem;
}

.main-header .logo-holder img {
   max-width: 100%;
}

.main-header .navbar .navbar-nav {
   flex-direction: row;
}

.main-header .navbar-nav .navbar-item {
   margin: 0 0.875rem;
}

.main-header .navbar-nav .navbar-item .ar-btn {
   display: none;
}

.main-header .navbar-nav .navbar-item a {
   color: var(--second_dark);
   font-size: 1.125rem;
}

.main-header .navbar-nav .navbar-item.active a {
   color: var(--danger);
}

.main-header .navbar-nav .navbar-item a:hover {
   color: var(--danger);
}

.main-header .navbar .mobile-menu {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 999;
   background-color: var(--light);
   padding: 1rem;
   justify-content: space-around;
   padding: 1rem 1rem 0 1rem;
   box-shadow: 0 -5px 30px 0 rgba(0, 0, 0, 0.05);
   display: none
}

.main-header .navbar .mobile-menu .ar-btn a {
   background-color: var(--light);
}

.main-header .navbar .mobile-menu .active .ar-btn a {
   background-color: var(--secondary);
   border-radius: 50% 50% 0 0;
}

.main-header .navbar .mobile-menu .active .ar-btn a .icon {
   font-weight: normal;
}

.main-header .navbar .mobile-menu .active .ar-btn a::before {
   content: '';
   background: url(../img/curve.svg) no-repeat center center;
   background-size: contain;
   width: 2rem;
   height: 3rem;
   position: absolute;
   bottom: 0;
   left: -1.5rem;
}

.main-header .navbar .mobile-menu .active .ar-btn a::after {
   content: '';
   background: url(../img/curve.svg) no-repeat center center;
   background-size: contain;
   width: 2rem;
   height: 3rem;
   position: absolute;
   bottom: 0;
   right: -1.5rem;
   transform: scaleX(-1);
}

/* /header section */

/* homepage styles */
.hero-sec {
   margin-bottom: 9rem;
}

.hero-banner-holder {
   display: inline-block;
   border: 3px solid var(--light_gray);
   border-top: 0;
   border-radius: 0 0 320px 320px;
   padding-bottom: 24px;
   padding-right: 1rem;
   position: relative;
}

.hero-banner-holder .hero-banner-bg {
   background: var(--light_gray);
   border-radius: inherit;
   display: inline-block;
   position: relative;
}

.hero-banner-holder .hero-banner-bg::before {
   content: "";
   background: url(../img/red-arrow.svg) no-repeat center center;
   background-size: contain;
   width: 6.25rem;
   height: 6.875rem;
   position: absolute;
   top: 6rem;
   left: 4rem;
}

.hero-banner-holder .hero-banner-bg::after {
   content: '';
   width: 24rem;
   height: 24rem;
   background-color: var(--light_gray);
   border-radius: 50%;
   position: absolute;
   bottom: -6rem;
   right: -1rem;
   z-index: -1;
   opacity: 0.6;
   filter: blur(50px);
}

.hero-banner-holder .hero-banner-bg img {
   max-width: 100%;
}


.hero-banner-holder .hero-info-card {
   background-color: var(--light);
   color: var(--primary);
   font-size: 0.875rem;
   padding: 0 1rem;
   line-height: 3.625rem;
   border-radius: 40px;
   display: inline-block;
   font-weight: bold;
   position: absolute;
   top: 2.5rem;
   left: -3.25rem;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
   animation-name: go_down;
   animation-duration: 6s;
   animation-iteration-count: infinite;
   animation-direction: alternate;
   animation-timing-function: linear;
}

.hero-banner-holder .hero-round-card {
   background-color: var(--light);
   font-size: 0.875rem;
   border-radius: 40px;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
   padding: 0.5rem;
   padding-right: 1.25rem;
   display: inline-flex;
   align-items: center;
   position: absolute;
   bottom: 10rem;
   left: 30%;
   animation-name: xy_move;
   animation-duration: 30s;
   animation-iteration-count: infinite;
   animation-direction: alternate;
   animation-timing-function: linear;
}

.hero-banner-holder .hero-round-card .dashed-border {
   width: 3.125rem;
   height: 3.125rem;
   display: flex;
   justify-content: center;
   margin-right: 1rem;
   align-items: center;
   background-color: var(--secondary);
   background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%233ACCA3FF' stroke-width='5' stroke-dasharray='50%2c20' stroke-dashoffset='73' stroke-linecap='round'/%3e%3c/svg%3e");
   border-radius: 100px;
   color: var(--primary);
   font-weight: 500;
}

.hero-banner-holder .hero-price-card {
   background-color: var(--light);
   display: inline-flex;
   flex-direction: column;
   align-items: center;
   padding: 0.75rem 2rem;
   border-radius: 20px;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
   position: absolute;
   top: 5.25rem;
   right: -3.75rem;
   animation-name: move_down;
   animation-duration: 7s;
   animation-iteration-count: infinite;
   animation-direction: alternate;
   animation-timing-function: linear;
}

.hero-banner-holder .hero-price-card::before {
   content: '';
   background: url(../img/curve-line.svg) no-repeat center center;
   background-size: contain;
   width: 2.5rem;
   height: 2.5rem;
   position: absolute;
   top: -0.5rem;
   right: -0.75rem;
   animation-name: rotate;
   animation-duration: 12s;
   animation-iteration-count: infinite;
   animation-timing-function: linear;
}

.hero-banner-holder .hero-price-card .title {
   font-weight: 500;
   font-size: 0.875rem;
}

.hero-banner-holder .hero-price-card .value {
   color: var(--primary);
   font-size: 2rem;
   font-weight: bold;
}

@keyframes go_down {
   0% {
      transform: translateY(0) rotate(-17deg);
   }

   100% {
      transform: translateY(3rem) rotate(17deg);
   }
}

@keyframes xy_move {
   from {
      transform: rotate(0deg) translateX(100%) rotate(0deg);
   }

   to {
      transform: rotate(180deg) translateX(100%) rotate(-180deg);
   }
}

@keyframes rotate {
   from {
      transform: rotate(0deg);
   }

   to {
      transform: rotate(360deg);
   }
}

@keyframes move_down {
   from {
      transform: translateY(0);
   }

   to {
      transform: translateY(4rem);
   }
}

.hero-main-sec {
   display: flex;
   flex-direction: column;
   justify-content: center;
   height: 100%;
   align-items: flex-start;
   padding-right: 3rem;
}

.hero-main-sec .sec-title {
   margin-bottom: 1.875rem;
}

.hero-main-sec .hero-des {
   margin-bottom: 1.875rem;
}

.hero-main-sec .hero-des p {
   color: var(--gray);
   padding: 0;
}

.about-argo {
   margin-bottom: 8.75rem;
}

.about-argo .sec-title {
   margin-bottom: 1.875rem;
}

.about-argo .des {
   margin-bottom: 2.5rem;
}

.about-argo .about-img-holder {
   border-radius: 210px 0 0 210px;
   max-height: 21.75rem;
   display: inline-flex;
   position: relative;
}

.about-argo .about-img-holder::before {
   content: '';
   width: calc(100% + 2rem);
   height: 100%;
   background-color: var(--secondary);
   border-radius: inherit;
   position: absolute;
   top: 1rem;
   left: 0;
   z-index: -1;
}

.about-argo .about-img-holder::after {
   content: '';
   width: 7.875rem;
   height: 6rem;
   background: url(../img/red-arrow-2.svg) no-repeat center center;
   background-size: contain;
   position: absolute;
   top: 1rem;
   left: calc(100% + 3rem);
   z-index: 1;
}

.about-argo .about-img-holder img {
   max-width: 100%;
   max-height: 100%;
   border-radius: inherit;
}

.about-argo .bg-blur {
   position: relative;
   display: inline-block;
}

.about-argo .bg-blur::before {
   content: '';
   background-image: linear-gradient(to top left, rgba(15, 209, 186, 0), rgba(58, 204, 163, 0.2));
   width: 52rem;
   height: 26.5rem;
   position: absolute;
   left: 0;
   opacity: 0.5;
   border-radius: 50%;
   filter: blur(50px);
   z-index: -2;
}

.features .sec-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 1.875rem;
}

.nav.nav-tabs {
   border: none;
}

.nav.nav-tabs .nav-item:not(:last-child) {
   margin-left: 1rem;
}

.nav.nav-tabs .nav-item .nav-link {
   background-color: transparent;
   color: var(--dark);
   font-size: 1.125rem;
   border-radius: 18px;
   line-height: 2.25rem;
   border: 1px solid transparent;
   padding: 0 1rem;
}

.nav.nav-tabs .nav-item .nav-link:hover {
   border-color: var(--secondary);
}

.nav.nav-tabs .nav-item .nav-link.active {
   background-color: var(--secondary);
   border-color: var(--secondary);
}

.features {
   margin-bottom: 8.75rem;
}

.features .features-list {
   list-style-type: none;
   padding: 0;
   margin: 0;
   display: flex;
   height: 100%;
   flex-direction: column;
   justify-content: center;
}

.features .features-list li {
   margin-bottom: 2.5rem;
}

.features .features-list li::before {
   content: '';
   width: 1.25rem;
   height: 1.25rem;
   border-radius: 50%;
   border-bottom-left-radius: 0;
   background-color: var(--danger);
   display: inline-block;
   margin-left: 0.875rem;
}

.features .features-list li span {
   font-size: 1.25rem;
   font-weight: 500;
}

.features .crm-img-holder {
   border-radius: 16px;
   display: inline-flex;
   max-height: 30.875rem;
   width: 100%;
}

.features .crm-img-holder img {
   max-width: 100%;
   max-height: 100%;
   border-radius: inherit;
}

.blog-sec {
   margin-bottom: 8.75rem;
}

.blog-sec .sec-title {
   margin-bottom: 4.25rem;
}

.owl-control-btns {
   display: flex;
   margin-bottom: 4.375rem;
}

.owl-control-btns button {
   color: var(--green);
   width: 2.5rem;
   height: 2.5rem;
   background-color: var(--light);
   border-radius: 50%;
   border: 1px solid var(--secondary);
   display: inline-flex;
   align-items: center;
   justify-content: center;
   margin-left: 0.75rem;
   transition: all 0.25s ease;
}

.owl-control-btns button .icon {
   transition: all 0.25s ease;
}

.owl-control-btns button:hover {
   border-color: var(--primary);
   color: var(--primary);
}

.blog-sec .blog-card {
   background-color: var(--light);
   border-radius: 156px 156px 0 0;
}

.blog-sec .blog-card .blog-img-holder {
   border-radius: inherit;
}

.blog-sec .blog-card .blog-img-holder a {
   border-radius: inherit;
}

.blog-sec .blog-card .blog-img-holder img {
   border-radius: inherit;
}

.blog-sec .blog-card .blog-card-body {
   padding: 0.75rem 1rem 1rem 1rem;
}

.blog-sec .blog-card .blog-card-body .date-holder {
   margin-bottom: 1rem;
}

.blog-sec .blog-card .blog-card-body .date-holder span {
   font-family: Rokh;
   font-size: 0.875rem;
}

.blog-sec .blog-card .blog-card-body .blog-title {
   font-size: 1rem;
   font-weight: 500;
   margin-bottom: 0.75rem;
}

.blog-sec .blog-card .blog-card-body .blog-title a {
   color: var(--dark);
}

.blog-sec .blog-card .blog-card-body .blog-title a:hover {
   color: var(--primary);
}

.blog-sec .blog-card .blog-card-body .ar-btn {
   font-size: 0.875rem;
   width: 100%;
   align-items: flex-end;
}

.comments-sec {
   position: relative;
   margin-bottom: 16.25rem;
}

.comments-sec::before {
   content: '';
   width: 23.75rem;
   height: 23.75rem;
   border-radius: 50%;
   background-color: var(--light_gray);
   position: absolute;
   opacity: 0.4;
   z-index: -1;
   right: 0;
   top: -3rem;
   filter: blur(50px);
}

.comments-sec .sec-title {
   margin-bottom: 4.5rem;
}

.comments-sec .comment-card {
   border-radius: 16px;
   background-color: var(--light);
   padding: 1.875rem;
   position: relative;
}

.comments-sec .comments-carousel .owl-stage-outer {
   padding: 1rem;
   margin: -1rem;
}

.comments-sec .comment-card::before {
   content: '';
   background: url(../img/quote.svg) no-repeat center center;
   background-size: contain;
   width: 2.25rem;
   height: 1.875rem;
   position: absolute;
   top: -0.75rem;
   right: -1.125rem;
   transform: rotate(180deg);
}

.comments-sec .comment-card::after {
   content: '';
   background: url(../img/quote.svg) no-repeat center center;
   background-size: contain;
   width: 2.25rem;
   height: 1.875rem;
   position: absolute;
   bottom: -0.75rem;
   left: -0.5rem;
}

.comments-sec .comment-card .comment-card-header {
   display: flex;
   align-items: center;
   margin-bottom: 1.25rem;
}

.comments-sec .comment-card .comment-card-header .user-avatar {
   width: 3.5rem;
   height: 3.5rem;
   border-radius: 50%;
   margin-left: 1rem;
}

.comments-sec .comment-card .comment-card-header .user-avatar img {
   max-width: 100%;
   max-height: 100%;
   border-radius: inherit;
}

.comments-sec .comment-card .comment-card-header .user-name {
   font-family: Rokh;
   font-size: 1.125rem;
}

.comments-sec .comment-card .comment-card-body {
   margin-bottom: 1.25rem;
}

.comments-sec .comment-card .comment-card-body p {
   color: var(--second_dark);
}

.comments-sec .comment-card .comment-card-footer {
   display: flex;
   justify-content: flex-end;
}

.comments-sec .comment-card .comment-card-footer .date-holder {
   font-family: Rokh;

}

.comments-sec .map-img-holder {
   display: inline-block;
   position: relative;
}

.comments-sec .map-img-holder img {
   max-width: 100%;
}

.comments-sec .map-img-holder .map-avatar {
   position: absolute;
   border-radius: 50%;
}

.comments-sec .map-img-holder .avatar-1 {
   right: 8.75rem;
   top: 1.5rem;
   width: 4.25rem;
   height: 4.25rem;
}

.comments-sec .map-img-holder .avatar-2 {
   width: 6.25rem;
   height: 6.25rem;
   top: 0;
   bottom: 0;
   right: 0;
   left: 0;
   margin: auto;
}

.comments-sec .map-img-holder .avatar-3 {
   width: 4.25rem;
   height: 4.25rem;
   left: 6.25rem;
   top: 1.5rem;
}

.comments-sec .map-img-holder .avatar-4 {
   width: 5.125rem;
   height: 5.125rem;
   right: 4rem;
   bottom: 2rem;
}

.comments-sec .map-img-holder .avatar-5 {
   width: 3.875rem;
   height: 3.875rem;
   bottom: 2rem;
   left: 5rem;
}

.comments-sec .comments-carousel .owl-dots {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
}

.comments-sec .comments-carousel .owl-dots .owl-dot {
   width: 0.875rem;
   height: 0.875rem;
   background-color: var(--second-gray);
   border-radius: 50%;
   margin: 0 0.375rem;
}

.comments-sec .comments-carousel .owl-dots .owl-dot.active {
   background-color: var(--green);
}

/* /homepage styles */

/* footer section */

footer {
   background-color: var(--light);
   padding-bottom: 1.875rem;
}

.newsletter {
   display: flex;
   justify-content: center;
   padding: 0 6.25rem;
}

.newsletter .newsletter-box {
   display: flex;
   width: 100%;
   justify-content: space-between;
   background-image: linear-gradient(to top right, #6567FC, #3ACCA3);
   border-radius: 20px;
   padding: 2.875rem 3.75rem;
   align-items: center;
   position: relative;
   margin-top: -5.5rem;
   margin-bottom: 3rem;
}

.newsletter .newsletter-box::before {
   content: '';
   background: url(../img/dots.svg) no-repeat center center;
   background-size: contain;
   width: 11.75rem;
   height: 8rem;
   position: absolute;
   right: -8rem;
   top: -3rem;
}

.newsletter .newsletter-box .newsletter-des .newsletter-title {
   font-size: 2rem;
   font-family: Rokh;
   color: var(--light);
   font-weight: bold;
   margin-bottom: 1.25rem;
}

.newsletter .newsletter-box .newsletter-des {
   color: var(--light);
}

.newsletter .newsletter-box .newsletter-form {
   background-color: var(--light);
   border-radius: 34px;
   padding: 0.375rem 1.25rem 0.375rem 0.375rem;
   min-width: 40%;
   display: flex;
   justify-content: flex-end;
}

.newsletter .newsletter-box .newsletter-form input {
   background-color: transparent;
   border: none;
   padding: 0;
   font-size: 0.875rem;
   margin-left: 0.5rem;
   flex: 1;
}

.newsletter .newsletter-box .newsletter-form input:focus {
   border: none;
   box-shadow: none;
   outline: none;
}

.newsletter .newsletter-box .newsletter-form input::placeholder {
   color: var(--gray);
}

.main-footer {
   display: flex;
   justify-content: space-between;
   margin-bottom: 2.5rem;
}

.main-footer .footer-logo-holder {
   flex: 0.3;
   margin-left: 6.25rem;
   display: flex;
   flex-direction: column;
   align-items: center;
}

.main-footer .footer-logo-holder .footer-logo {
   margin-bottom: 1.875rem;
   max-width: 9.125rem;
}

.main-footer .footer-logo-holder .footer-logo img {
   max-width: 100%;
}

.main-footer .footer-menus {
   display: flex;
   flex: 1;
   margin-left: 6.25rem;
   justify-content: space-between;
}

.main-footer .footer-menus .footer-menu-item .footer-menu-title {
   font-size: 1.25rem;
   margin-bottom: 1.875rem;
}

.main-footer .footer-menus .footer-menu-item ul {
   list-style-type: none;
   padding: 0;
   margin: 0;
}

.main-footer .footer-menus .footer-menu-item ul li {
   margin-bottom: 1.75rem;
}

.main-footer .footer-menus .footer-menu-item ul li a {
   color: var(--dark);
}

.main-footer .footer-menus .footer-menu-item ul li a:hover {
   color: var(--danger);
}

.main-footer .certificates {
   display: flex;
   flex-direction: column;
}

.main-footer .certificates .certif-box {
   background-color: var(--third-gray);
   border-radius: 16px;
   width: 5.5rem;
   height: 5.5rem;
   display: flex;
   justify-content: center;
   align-items: center;
}

.main-footer .certificates .certif-box {
   max-width: 100%;
}

.main-footer .certificates .certif-box:not(:last-child) {
   margin-bottom: 0.75rem;
}

.bottom-footer {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 1rem 1.875rem;
   background-color: var(--primary);
   border-radius: 20px;
   color: var(--light);
}

.bottom-footer .contact-info {
   display: flex;
}

.bottom-footer .contact-info .contact-item {
   display: flex;
   align-items: center;
   margin-left: 2.5rem;
}

.bottom-footer .contact-info .contact-item .icon-holder {
   width: 2.875rem;
   height: 2.875rem;
   border-radius: 50%;
   background-color: var(--light);
   display: flex;
   justify-content: center;
   align-items: center;
   color: var(--primary);
   margin-left: 0.75rem;
}

.bottom-footer .contact-info .contact-item .icon-holder .icon {
   font-size: 1.75rem;
   font-weight: normal;
}

.bottom-footer .contact-info .contact-item .contact-det {
   display: flex;
   flex-direction: column;
}

.bottom-footer .contact-info .contact-item .contact-det .title {
   font-size: 1.125rem;
   margin-bottom: 0.5rem;
}

.bottom-footer .contact-info .contact-item .contact-det .value {
   font-size: 0.875rem;
}

.bottom-footer .more-info .social-media {
   display: flex;
   align-items: flex-end;
   flex-direction: column;
}

.bottom-footer .more-info .social-media .social-media-btns {
   display: flex;
   align-items: center;
   margin-bottom: 0.875rem;
}

.bottom-footer .more-info .social-media .social-media-btns>a {
   margin-left: 0.75rem;
}

.bottom-footer .more-info .social-media .social-media-btns .icon-holder {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 2.25rem;
   height: 2.25rem;
   background-color: #fff;
   border-radius: 50%;
   color: var(--primary);
}

.bottom-footer .more-info .social-media .social-media-btns .instagram::after {
   content: '';
   width: 100%;
   height: 100%;
   background-image: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
   border-radius: inherit;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 0;
   opacity: 0;
   transition: all 0.25s ease;
}

.bottom-footer .more-info .social-media .social-media-btns .icon {
   font-weight: normal;
   font-size: 1.5rem;
   position: relative;
   z-index: 1;
}

.bottom-footer .more-info .go-to-top .icon-left .icon-holder {
   margin-left: 0;
}

.bottom-footer .more-info .go-to-top .blob-btn__blob {
   background-color: var(--secondary);
}

.bottom-footer .more-info .go-to-top:hover button {
   color: var(--dark);
}

.bottom-footer .more-info .go-to-top:hover .icon {
   color: var(--secondary);
}

.bottom-footer .more-info .social-media .social-media-btns a:hover span {
   color: #fff;
}

.bottom-footer .more-info .social-media .social-media-btns a:hover .instagram::after {
   opacity: 1;
}

.bottom-footer .more-info .social-media .social-media-btns a:hover .aparat {
   background-color: #ea1d5d;
}

/* /footer section */

/* blog archive */

.breadcrumb-card {
   display: flex;
   align-items: center;
   flex-direction: column;
   padding: 1rem 0;
   background-image: linear-gradient(to top right, #6567FC, #3ACCA3);
   border-radius: 0 0 40px 40px;
   margin-bottom: 3.25rem;
}

.breadcrumb-card .page-title {
   font-family: Rokh;
   font-size: 2rem;
   color: var(--light);
   font-weight: bold;
   margin-bottom: 0.75rem;
}

.breadcrumb-card .breadcrumb {
   margin-bottom: 0;
}

.breadcrumb-card .breadcrumb li {
   display: flex;
   align-items: center;
   color: var(--light);
}

.breadcrumb-card .breadcrumb li:not(:last-child) {
   margin-left: 0.625rem;
}

.breadcrumb-card .breadcrumb li:not(:last-child)::after {
   content: '\e930';
   color: var(--light);
   font-family: 'icomoon' !important;
   margin-right: 0.625rem;
}

.breadcrumb-card .breadcrumb li a {
   color: var(--light_gray);
   font-size: 0.875rem;
}

.breadcrumb-card .breadcrumb li a:hover {
   color: var(--light);
}

.filter-section {
   margin-bottom: 3.25rem;
}

.filters {
   display: inline-flex;
   align-items: center;
}

.filters .dropdown {
   margin-left: 0.75rem;
}

.dropdown-toggle::after {
   display: none;
}

.dropdown.ar-btn .dropdown-toggle {
   z-index: 2;
}

.dropdown-menu {
   width: 100%;
   border: none;
   border-radius: 24px;
   top: -2.5rem !important;
   padding-top: 3rem;
   z-index: 1;
   padding-bottom: 1rem;
}

.dropdown-menu .dropdown-item {
   padding: 0 1rem;
   line-height: 2.5rem;
   font-size: 0.875rem;
   color: var(--dark);
}

.blogs {
   margin-bottom: 2.5rem;
}

.main-blog-card {
   display: flex;
   justify-content: space-between;
   align-items: center;
   background-color: var(--light);
   border-radius: 156px 156px 0 0;
   padding-left: 3.75rem;
   position: relative;
   margin-right: 4.75rem;
   margin-bottom: 1.875rem;
   transform: translateX(-130%);
   transition: all 0.25s ease-in-out;
}

.main-blog-card:hover {
   box-shadow: 0 1px 20px rgba(0, 0, 0, 0.05);
}

.main-blog-card.active {
   transform: translateX(0);
}

.main-blog-card.animated {
   animation-name: blog_move;
   animation-duration: 2s;
   animation-iteration-count: 1;
   animation-timing-function: ease-in-out;
}

.main-blog-card .img-holder {
   display: inline-block;
   border-radius: 156px 156px 0 0;
   max-width: 19.5rem;
}

.main-blog-card .img-holder img {
   max-width: 100%;
   border-radius: inherit;
}

.main-blog-card .blog-card-det {
   width: calc(100% - 21.625rem);
}

.main-blog-card .blog-card-det .card-title {
   font-size: 1rem;
   font-weight: 500;
   margin-bottom: 0.875rem;
}

.main-blog-card .blog-card-det .card-title a {
   color: var(--dark);
}

.main-blog-card .blog-card-body {
   margin-bottom: 1rem;
}

.main-blog-card .blog-card-body p {
   font-size: 0.875rem;
}

.main-blog-card .blog-card-footer {
   display: flex;
   justify-content: space-between;
}

.blog-informations {
   display: flex;
   align-items: center;
}

.blog-informations .blog-info-item {
   display: flex;
   align-items: flex-end;
   margin-left: 1.875rem;
}

.blog-informations .blog-info-item span {
   font-size: 0.875rem;
   font-weight: 300;
}

.blog-informations .blog-info-item .icon {
   font-size: 1.5rem;
   margin-left: 0.5rem;
}

.main-blog-card .blog-card-det .blog-date {
   position: absolute;
   left: calc(100% + 2.125rem);
   bottom: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
}

.main-blog-card .blog-card-det .blog-date::after {
   content: '';
   width: 2px;
   height: 8.375rem;
   background-color: #F1F1F1;
   position: absolute;
   bottom: calc(100% + 0.75rem);
   left: 0;
   right: 0;
   margin: auto;
}

.main-blog-card .blog-card-det .blog-date span {
   color: var(--primary);
   font-family: Rokh;
   font-weight: 700;
}

@keyframes blog_move {
   0% {
      transform: translateX(-130%)
   }

   90% {
      transform: translateX(30px)
   }

   100% {
      transform: translateX(0)
   }
}

.pagination-sec {
   margin-bottom: 10rem;
}

.pagination-sec .pagination-holder {
   display: flex;
   justify-content: flex-end;
}

.pagination-sec .pagination-holder .pagination {
   direction: ltr;
   background-color: var(--light);
   border-radius: 28px;
   padding: 0.75rem;
   margin: 0;
}

.pagination-sec .pagination-holder .pagination li:not(:last-child) {
   margin-right: 0.5rem;
}

.pagination-sec .pagination-holder .pagination li.active a {
   background-color: #3ACCA3;
   color: var(--light);
}

.pagination-sec .pagination-holder .pagination li a {
   width: 2rem;
   height: 2rem;
   border-radius: 50%;
   background-color: #F5F5F5;
   color: var(--dark);
   display: flex;
   align-items: center;
   justify-content: center;
}

.pagination-sec .pagination-holder .pagination li a:hover {
   background-color: #dfdfdf;
}

.pagination-sec .pagination-holder .pagination li a .icon {
   font-size: 1.5rem;
}

/* /blog archive */

/* single blog */

.blog-single-sec {
   margin-bottom: 19.25rem;
}

.single-blog-card {
   display: flex;
   flex-direction: column;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
   border-radius: 156px 156px 0 0;
   margin-bottom: 6.25rem;
}

.single-blog-card .img-holder {
   display: inline-flex;
   max-height: 25rem;
   justify-content: center;
   border-radius: 156px 156px 0 0;
}

.single-blog-card .img-holder img {
   max-width: 100%;
   max-height: 100%;
   border-radius: inherit;
   margin: 0;
}

.single-blog-card .single-blog-det {
   background-color: var(--light);
   padding: 2.75rem 1.875rem 1.875rem 1.875rem;
}

.single-blog-card .single-blog-det .blog-title {
   font-family: Rokh;
   font-size: 1.5rem;
   font-weight: 700;
   margin-bottom: 1.875rem;
}

.single-blog-card .blog-informations {
   margin-bottom: 1.875rem;
}

.single-blog-card img {
   border-radius: 16px;
   margin: 1.75rem 0.75rem;
   max-width: 100%;
}

.single-blog-card .blog-card-footer {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-top: 1.875rem;
   padding-top: 1.875rem;
   border-top: 1px solid var(--secondary);
}

.single-blog-card .blog-card-footer .category {
   display: flex;
}

.single-blog-card .blog-card-footer .category .title {
   margin-left: 0.25rem;
}

.single-blog-card .blog-card-footer .actions {
   display: flex;
   align-items: center;
}

.single-blog-card .blog-card-footer .actions button {
   background-color: transparent;
   border: none;
   padding: 0;
   margin: 0 0.75rem 0 0;
   display: inline-flex;
}


.single-blog-card .blog-card-footer .actions button .icon {
   color: var(--green);
   font-size: 1.75rem;
}

.single-blog-card .blog-card-footer .actions button.active .icon-like-1::before {
   content: '';
   background: url(../img/bold-like.svg) no-repeat center center;
   background-size: contain;
   width: 1.75rem;
   height: 1.75rem;
   display: flex;
}

.single-blog-card .blog-card-footer .actions button.active .icon-archive-minus::before {
   content: '';
   background: url(../img/bold-archive-minus.svg) no-repeat center center;
   background-size: contain;
   width: 1.75rem;
   height: 1.75rem;
   display: flex;
}

.comments-section .comment-title {
   font-family: Rokh;
   font-size: 1.5rem;
   font-weight: bold;
   color: var(--primary);
   margin-bottom: 2.75rem;
}

.comments-section .comment-item {
   margin-bottom: 2.25rem;
}

.comments-section .comment-item .comment-item-inner {
   background-color: var(--light);
   border-radius: 16px;
   margin-bottom: 0.75rem;
   padding: 1.25rem;
   display: inline-block;
}

.comments-section .comment-item .comment-item-inner .user-name {
   font-family: Rokh;
   font-weight: bold;
   font-size: 1.125rem;
   margin-bottom: 1.25rem;
}

.comments-section .comment-item .date {
   margin-right: 1.25rem;
}

.comments-section .comment-item .date span {
   color: var(--primary);
}

.rounded-card {
   background-color: var(--light);
   border-radius: 165px 165px 0 0;
   padding: 5rem 1.5rem 2.5rem 1.5rem;
   display: flex;
   align-items: center;
   flex-direction: column;
   margin-bottom: 1.25rem;
}

.rounded-card.border-radius-0 {
   border-radius: 0 !important;
   padding-top: 1.875rem;
}

.rounded-card .card-title {
   font-size: 1.5rem;
   font-family: Rokh;
   font-weight: bold;
   margin-bottom: 1.875rem;
}

.rounded-card .related-item {
   background-color: var(--third-gray);
   border-radius: 8px;
   padding: 0.75rem;
}

.rounded-card .related-item:not(:last-child) {
   margin-bottom: 1.25rem;
}

.rounded-card .related-item .related-item-title {
   font-size: 0.875rem;
   margin-bottom: 1.125rem;
}

.rounded-card .related-item .related-item-title a {
   color: var(--dark);
}

.rounded-card .related-item .related-item-footer {
   display: flex;
   justify-content: space-between;
}

.rounded-card .related-item .related-item-footer .date span {
   font-size: 0.75rem;
   font-family: Rokh;
}

.rounded-card .related-item .related-item-footer .ar-btn a {
   font-size: 0.75rem;
}

.rounded-card .search-holder {
   background-color: #F9F9F9;
   border-radius: 24px;
   padding: 0.375rem 1rem 0.375rem 0.375rem;
   min-width: 40%;
   display: flex;
   justify-content: flex-end;
   margin-bottom: 1.25rem;
   width: 100%;
}

.rounded-card .search-holder input {
   background-color: transparent;
   border: none;
   padding: 0;
   font-size: 0.875rem;
   margin-left: 0.5rem;
   flex: 1;
}

.rounded-card .search-holder input:focus {
   box-shadow: none;
   outline: none;
}

.rounded-card .search-holder .submit-btn {
   width: 2.5rem;
   height: 2.5rem;
   border: none;
   padding: 0;
   background-color: var(--secondary);
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
}

.rounded-card .search-holder .submit-btn .icon {
   color: var(--green);
   font-size: 1.5rem;
}

/* /single blog */

/* global forms */

.form-group {
   margin-bottom: 1.25rem;
   display: flex;
   flex-direction: column;
}

.form-group label {
   margin-bottom: 0.625rem;
}

.form-group .subtitle {
   font-size: 0.875rem;
   margin-bottom: 0.625rem;
}

.form-group.invalid .form-control {
   border-color: var(--danger)
}

.form-control {
   background-color: var(--third-gray);
   border-radius: 24px;
   padding: 0 3rem 0 1rem;
   line-height: 2.875rem;
   font-size: 0.875rem;
   font-weight: 300;
   border-color: var(--third-gray);
   transition: all 0.25s ease;
}

textarea.form-control {
   border-radius: 16px;
}

.form-control:focus {
   outline: none;
   box-shadow: none;
   border-color: var(--green);
}

.form-input-holder {
   position: relative;
}

.form-input-holder .icon {
   position: absolute;
   top: 0;
   bottom: 0;
   right: 1rem;
   margin: auto;
   color: var(--green);
   font-size: 1.5rem;
   max-height: 1.5rem;
   z-index: 0;
}

.form-input-holder.custom-select .icon {
   z-index: 2;
}

.form-input-holder.custom-text-area .icon {
   top: 1rem;
   bottom: unset;
}

.form-input-holder.custom-text-area .form-control {
   padding-right: 3rem;
}

textarea.form-control {
   padding: 1rem;
   line-height: normal;
}

.custom-checkbox-holder {
   margin-bottom: 1.25rem;
   display: inline-block;
}

.custom-checkbox-holder label {
   display: flex;
   align-items: center;
   cursor: pointer;
}

.custom-checkbox-holder label input {
   display: none;
}

.custom-checkbox-holder label input:checked~.custom-checkbox::after {
   content: '';
   background: url(../img/tick.svg) no-repeat center center;
   background-size: contain;
   width: 0.75rem;
   height: 0.5rem;
}

.custom-checkbox-holder label .custom-checkbox {
   width: 1.5rem;
   height: 1.5rem;
   border: 2px solid var(--green);
   border-radius: 8px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-left: 0.5rem;
}

.custom-checkbox-holder label .label {
   font-size: 0.875rem;
}

.input-pwd {
   display: flex;
   justify-content: space-between;
   direction: ltr;
}

.input-pwd input {
   max-width: 3rem;
   height: 3rem;
   background-color: #F2F2F2;
   border-radius: 24px 24px 0 0;
   text-align: center;
   border: 1px solid #f2f2f2;
   font-size: 1.25rem;
   font-weight: 500;
   margin-bottom: 2.5rem;
}

.input-pwd input:focus {
   border-color: var(--secondary);
   outline: none;
   box-shadow: none;
   background-color: var(--light);
}

/* /global forms */


/* contact us */

.social-media-sec {
   margin-bottom: 3rem;
}

.social-title {
   font-size: 1.5rem;
   font-family: Rokh;
   margin-bottom: 1.875rem;
   font-weight: bold;
}

.social-card {
   display: flex;
   justify-content: center;
   background-color: var(--light);
   border-radius: 70px;
   padding: 1.5rem 1.875rem;
}

.social-media-sec .social-card .icon-holder {
   width: 3rem;
   height: 3rem;
   border-radius: 50%;
   background-color: var(--third-gray);
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 1.5rem;
}

.social-media-sec .social-card .icon-holder .icon {
   font-size: 1.875rem;
   color: var(--primary);
}

.social-media-sec .social-card .icon-holder.instagram::after {
   content: '';
   width: 100%;
   height: 100%;
   background-image: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
   border-radius: inherit;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 0;
   opacity: 0;
   transition: all 0.25s ease;
}

.social-media-sec .social-card .icon-holder:hover .icon {
   color: var(--light);
   position: relative;
   z-index: 1;
}

.social-media-sec .social-card .icon-holder.telegram:hover {
   background-color: var(--primary);
}

.social-media-sec .social-card .icon-holder.whatsapp:hover {
   background-color: var(--green);
}

.social-media-sec .social-card .icon-holder.aparat:hover {
   background-color: #ea1d5d;
}

.social-media-sec .social-card .icon-holder.instagram:hover::after {
   opacity: 1;
}

.map-sec {
   margin-bottom: 18.75rem;
}

.map-sec .map-holder {
   width: 100%;
   height: 25rem;
   border-radius: 16px;
   display: flex;
}

.map-sec .map-holder a {
   border-radius: inherit;
   width: 100%;
   height: 100%;
   background: url(../../upload/map.jpeg) no-repeat right center;
   background-size: cover;
}

.map-sec .map-holder a .address-box {
   position: absolute;
   top: 40%;
   right: 20%;
   background-color: rgba(1, 1, 253, 0.6);
   border-radius: 12px;
   padding: 1rem;
   max-width: 17.5rem;
}

.map-sec .map-holder a .address-box .title {
   color: var(--light);
   font-size: 1.25rem;
   font-weight: 500;
}

.map-sec .map-holder a .address-box p {
   color: var(--light);
}

.map-sec .contact-form {
   display: flex;
   justify-content: space-between;
   padding-left: 2.875rem;
}

.map-sec .base-card {
   min-width: 31.25rem;
   position: relative;
   margin-top: -20.75rem;
}

.map-sec .contact-form .call-numbers {
   display: flex;
   padding-top: 3.625rem;
   height: fit-content;
   align-items: center;
}

.map-sec .contact-form .call-numbers .icon-holder {
   width: 2.875rem;
   height: 2.875rem;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--primary);
   border-radius: 50%;
   margin-left: 1rem;
}

.map-sec .contact-form .call-numbers .icon-holder .icon {
   color: var(--light);
   font-size: 1.875rem;
}

.map-sec .contact-form .call-numbers .title {
   font-family: Rokh;
   font-size: 1.25rem;
   font-weight: bold;
   margin-left: 1rem;
}

.map-sec .contact-form .call-numbers .num {
   margin-left: 1rem;
   direction: ltr
}

/* /contact us */

/* about us */

.about-us {
   margin-bottom: 16rem;
}

.about-us .description-item {
   padding-top: 1.875rem;
   margin-bottom: 6rem;
}

.about-us .description-item .description {
   display: flex;
   justify-content: center;
   flex-direction: column;
   height: 100%;
}

.about-us .description-item .description .description-title {
   font-family: Rokh;
   font-weight: bold;
   font-size: 1.5rem;
   margin-bottom: 1.875rem;
}

.about-us .description-item .img-holder {
   display: block;
   border: 3px solid var(--light_gray);
   height: 27.5rem;
}

.about-us .description-item .img-holder.radius-top {
   border-radius: 250px 250px 0 0;
}

.about-us .description-item .img-holder.radius-bottom {
   border-radius: 0 0 250px 250px;
}

.about-us .description-item .img-holder img {
   border-radius: inherit;
   height: 100%;
   width: 100%;
}

.about-us .description-item .img-holder.radius-top img {
   margin-right: -2.625rem;
   margin-top: -1.875rem;
}

.about-us .description-item .img-holder.radius-bottom img {
   margin-right: 2.625rem;
   margin-top: 1.875rem;
}

.pl-4 {
   padding-left: 4.5rem;
}

.pr-4 {
   padding-right: 4.5rem;
}

/* /about us */

/* representatives */

.map svg path {
   fill: url(#MyGradient) !important;
}

.map svg path.selected {
   fill: url(#MyGradientSelected) !important;
}

.map svg path.has-reseller {
   fill: url(#hasReseller) !important;
}

.representatives-sec {
   margin-bottom: 10rem;
}

.representatives-sec .main-title {
   text-align: center;
   font-size: 1.5rem;
   font-weight: bold;
   font-family: Rokh;
   margin-bottom: 5.5rem;
}

.representatives-sec .search-group {
   background-color: var(--light);
   border-radius: 5px;
   padding: 0.75rem 1.25rem;
   position: relative;
   margin-bottom: 2.5rem;
   display: flex;
   justify-content: center;
   align-items: center;
}

.representatives-sec .search-group::before {
   content: "";
   height: 2.875rem;
   width: 90%;
   position: absolute;
   right: 0;
   left: 0;
   bottom: -0.375rem;
   margin: 0 auto;
   background-color: #E1DADA;
   border-radius: 50%;
   filter: blur(20px);
   z-index: -1;
}

.representatives-sec .search-group .search-item {
   padding: 0.375rem 1rem 0.375rem 0.375rem;
   background-color: var(--third-gray);
   border-radius: 30px;
   display: flex;
   width: 100%;
}

.representatives-sec .search-group .search-item input {
   background-color: transparent;
   border: none;
   padding: 0;
   font-size: 0.875rem;
   margin-left: 0.5rem;
   flex: 1;
}

.representatives-sec .search-group .search-item input:focus {
   box-shadow: none;
   outline: none;
}

.representatives-sec .search-group .search-item input::placeholder {
   color: #959595;
}

.representatives-sec .list-city {
   max-height: 18.75rem;
   overflow-y: auto;
}

#map1 {
   position: relative;
}

#map1::after {
   content: "";
   width: 97%;
   height: 4rem;
   background-color: var(--light);
   position: absolute;
   bottom: 0;
   right: 0;
   opacity: 0.6;
}

.representatives-sec .list-city ul {
   padding: 0;
   margin: 0;
   list-style-type: none;
   padding-left: 1.125rem;
}

.representatives-sec .list-city ul li {
   display: flex;
   justify-content: space-between;
   margin-bottom: 1rem;
   align-items: center;
}

.representatives-sec .list-city ul li .name::before {
   content: '';
   width: 0.625rem;
   height: 0.625rem;
   border-radius: 50%;
   background-color: var(--green);
   display: inline-block;
   margin-left: 1rem;
}

#map2 {
   display: none;
}

.no-result {
   display: none;
}

#map1.searching::after {
   display: none;
}

.map {
   display: flex;
   justify-content: flex-end;
}

.search-group .city-name {
   margin: 0 auto;
}

.search-group .back {
   display: flex;
}

.search-group .back i {
   font-size: 1.5rem;
}

.representatives-sec .in-list .info {
   display: flex;
   align-items: center;
   margin-bottom: 2rem;
}

.representatives-sec .in-list .info .icon-holder {
   width: 3rem;
   height: 3rem;
   border-radius: 50%;
   background-color: var(--light);
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 1.125rem;
}

.representatives-sec .in-list .info .icon-holder .icon {
   font-size: 1.875rem;
   color: var(--primary);
}

.representatives-sec .in-list .info .info-det {
   display: flex;
   flex-direction: column;
}

.representatives-sec .in-list .info .info-det .in-tg {
   font-size: 0.75rem;
   margin-bottom: 0.25rem;
}

.signup-reseller {
   margin-bottom: 15rem;
}

.signup-reseller .description {
   display: flex;
   align-items: center;
   height: 100%;
   padding-left: 5.75rem;
}

.signup-reseller .description .des-inner {
   display: flex;
   flex-direction: column;
   position: relative;
}

.signup-reseller .description .des-inner::after {
   content: '';
   width: 7.25rem;
   height: 6.875rem;
   position: absolute;
   top: 100%;
   left: 0;
   background: url(../img/red-arrow-3.svg) no-repeat center center;
   background-size: contain;
}

.signup-reseller .description .title {
   font-size: 1.5rem;
   font-family: Rokh;
   font-weight: bold;
   margin-bottom: 1.875rem;
}

.signup-reseller .description p {
   font-size: 1.125rem;
}

/* /representatives */

/* download packages */

.download-sec {
   margin-bottom: 16rem;
}

.download-sec .social-card {
   justify-content: space-between;
   align-items: center;
}

/* /download packages */

/* login page */

.login-page {
   min-height: 100vh;
   background-color: #f2f2f2;
   position: relative;
   padding: 2.625rem 0;
}

.login-page .circle {
   width: 27.75rem;
   height: 27.75rem;
   border-radius: 50%;
   position: absolute;
   filter: blur(50px);
   opacity: 0.3;
}

.login-page .circle.circle-1 {
   background-color: var(--secondary);
   top: 0;
   left: 1.25rem;
}

.login-page .circle.circle-2 {
   background-color: var(--light_gray);
   top: 0;
   right: 1rem;
}

.login-page .circle.circle-3 {
   background-color: var(--light_gray);
   bottom: 0;
   left: 0;
}

.login-page .circle.circle-4 {
   background-color: var(--secondary);
   bottom: 0;
   right: 1.25rem;
}

.login-page .top-radius-card {
   background-color: var(--light);
   border-radius: 260px 260px 0 0;
   position: relative;
   padding: 0 2.75rem;
   max-width: 28rem;
   margin: auto;
}

.login-page .top-radius-card::before {
   content: '';
   position: absolute;
   border-radius: inherit;
   border: 3px solid var(--light_gray);
   width: 100%;
   height: 100%;
   z-index: -1;
   right: -1.5rem;
   top: -0.75rem;
}

.login-page .top-radius-card .r-card-header {
   padding: 5.375rem 5.375rem 0 5.375rem;
   display: flex;
   justify-content: space-between;
   margin-bottom: 2.125rem;
   align-items: flex-end;
}

.login-page .top-radius-card .r-card-header .back {
   background-color: transparent;
   padding: 0;
   border: none;
   margin: 0;
   display: flex;
   float: right;
}

.login-page .top-radius-card .r-card-header .logo-holder {
   margin: 0 auto;
   max-width: 8.75rem;
}

.login-page .top-radius-card .r-card-header .logo-holder img {
   max-width: 100%;
}

.login-page .top-radius-card .r-card-header .back .icon {
   color: var(--primary);
   font-size: 1.5rem;
}

.login-page .top-radius-card .r-card-body {
   display: flex;
   flex-direction: column;
   margin-bottom: 0.75rem;
}

.login-page .top-radius-card .r-card-footer {
   padding-bottom: 1.25rem;
   display: flex;
   flex-direction: column;
}

.login-page .top-radius-card .r-card-footer .form-info {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.login-page .top-radius-card .r-card-footer .form-info .custom-checkbox-holder {
   margin-bottom: 0;
}

.login-page .top-radius-card .r-card-footer .form-info .error {
   font-size: 0.875rem;
   color: var(--danger);
   display: none;
}

.login-page .top-radius-card .r-card-footer .submit-btn {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
}

.login-page .top-radius-card .r-card-footer .submit-btn button {
   color: var(--light);
   border: none;
   line-height: 3rem;
   border-radius: 24rem;
   padding: 0 2.625rem;
   box-shadow: 1px 2px 20px 0 rgba(1, 1, 253, 0.2);
   background: linear-gradient(90deg, #3BCCA4, #6567FC, #3BCCA4);
   background-size: 200% 100%;
   background-position: 101% 0;
   transition: background-position .5s;
}

.login-page .top-radius-card .r-card-footer .submit-btn button:hover {
   background-position: 0 0;
}

.login-page .top-radius-card .r-card-footer .form-info.invalid .custom-checkbox-holder {
   display: none;
}

.login-page .top-radius-card .r-card-footer .form-info.invalid .error {
   display: inline-block;
}

.login-page .top-radius-card .r-card-body .timer {
   text-align: center;
   color: var(--primary);
   font-family: Rokh;
   font-size: 1.25rem;
   font-weight: bold;
}

.login-page .top-radius-card .r-card-footer .ar-btn.border-btn {
   flex-direction: row;
}

/* /login page */

/* empty state */

.empty-state {
   margin-bottom: 14.5rem;
}

.empty-state .empty-state-sec {
   display: flex;
   flex-direction: column;
   align-items: center;
}

.empty-state .empty-state-sec .img-holder {
   display: inline-block;
   margin-bottom: 3.25rem;
}

.empty-state .empty-state-sec p {
   font-size: 1.5rem;
   font-family: Rokh;
}

/* /empty state */

/* dashboard */

.upload-image {
   border-radius: 50%;
   background-color: var(--light);
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.1);
   width: 1.75rem;
   height: 1.75rem;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   bottom: -0.25rem;
   right: -0.25rem;
}

.upload-image .icon {
   color: #959595;
   font-size: 1rem;
}

.upload-image .pb-uploader-input {
   width: 100%;
   height: 100%;
   opacity: 0;
   position: absolute;
   top: 0;
   right: 0;
}

.hamburger {
   background: transparent;
   width: 2rem;
   height: 2rem;
   position: relative;
   padding: 0;
   border: none;
   display: none;
}

.hamburger:focus {
   outline: none;
   border: none;
   box-shadow: none;
}

.hamburger .bar {
   padding: 0;
   width: 2rem;
   height: 4px;
   background-color: var(--primary);
   display: block;
   border-radius: 4px;
   transition: all 0.4s ease-in-out, transform 0.4s ease-in-out 0.4s;
   position: absolute;
}

.bar1 {
   top: 0;
}

.bar2,
.bar3 {
   top: 0;
   bottom: 0;
   margin: auto;
}

.bar3 {
   right: 0;
}

.hamburger .bar4 {
   top: 0;
   bottom: 0;
   margin: auto;
}

.hamburger .bar5 {
   bottom: 0px;
}

.hamburger .bar2 {
   width: 1px;
   transform: rotate(90deg);
   left: 13.5px;
}

.hamburger .bar3 {
   width: 1px;
   left: 13.5px;
   background-color: transparent;
}

.hamburger[aria-expanded="true"] .bar1 {
   top: 13.5px;
   background-color: transparent;
}

.hamburger[aria-expanded="true"] .bar2 {
   left: 0px;
   width: 2rem;
   transform: rotate(45deg);
}

.hamburger[aria-expanded="true"] .bar3 {
   left: 0;
   width: 2rem;
   transform: rotate(-45deg);
   background-color: var(--primary);
}

.hamburger[aria-expanded="true"] .bar4 {
   background-color: transparent;
}

.hamburger[aria-expanded="true"] .bar5 {
   bottom: 13.5px;
   background-color: transparent;
}

.dashboard {
   margin-bottom: 17.75rem;
}

.dashboard .menu-card {
   background-color: var(--light);
   border-radius: 175px 175px 0 0;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
}

.dashboard .menu-card .menu-card-header {
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: 1.25rem 0.625rem 0.875rem 0.625rem;
   margin: 0 0.625rem 0 0.625rem;
   border-bottom: 1px solid #E5E5E5;
}

.dashboard .menu-card .menu-card-header .user-avatar {
   display: inline-block;
   margin-bottom: 0.75rem;
   width: 3.75rem;
   height: 3.75rem;
   position: relative;
   border-radius: 50%;
}

.dashboard .menu-card .menu-card-header .user-avatar img {
   max-width: 100%;
}

.dashboard .menu-card .menu-card-header .user-det {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
}

.dashboard .menu-card .menu-card-header .user-name {
   font-weight: 500;
}

.dashboard .menu-card .menu-card-body {
   padding: 0.625rem 0 0.375rem 0;
}

.dashboard .menu-card .menu-card-body .dashboard-menu {
   list-style-type: none;
   padding: 0;
   margin: 0;
}

.dashboard .menu-card .menu-card-body .dashboard-menu li a {
   display: flex;
   align-items: center;
   color: var(--dark);
   padding: 0.875rem 1rem;
   font-size: 0.875rem;
   position: relative;
}

.dashboard .menu-card .menu-card-body .dashboard-menu li a:hover {
   color: var(--primary);
}

.dashboard .menu-card .menu-card-body .dashboard-menu li a .icon {
   margin-left: 0.5rem;
   font-size: 1.25rem;
}

.dashboard .menu-card .menu-card-body .dashboard-menu li.active a {
   color: var(--primary);
}

.dashboard .menu-card .menu-card-body .dashboard-menu li.active a::after {
   content: "";
   width: 0.25rem;
   height: 1.25rem;
   background-color: var(--primary);
   border-radius: 10px;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 1rem;
   margin: auto;
}

.dashboard .dashboard-card {
   display: flex;
   flex-direction: column;
   padding: 1.25rem;
   border-radius: 16px;
   position: relative;
   margin-bottom: 1.875rem;
}

.dashboard .dashboard-card::after {
   content: '';
   width: 14.375rem;
   height: 11rem;
   background-size: contain;
   position: absolute;
   z-index: -1;
}

.dashboard .dashboard-card.radius-top-right::after {
   background: url(../img/radius-top-right.svg) no-repeat center center;
   bottom: 0;
   left: 0;
}

.dashboard .dashboard-card.radius-top-left::after {
   background: url(../img/radius-top-left.svg) no-repeat center center;
   bottom: 0;
   right: 0;
}

.dashboard .dashboard-card.radius-bottom-left::after {
   background: url(../img/radius-bottom-left.svg) no-repeat center center;
   top: 0;
   right: 0;
}

.dashboard .dashboard-card.radius-bottom-right::after {
   background: url(../img/radius-bottom-right.svg) no-repeat center center;
   top: 0;
   left: 0;
}

.dashboard .dashboard-card.to-left-gradient {
   background-image: linear-gradient(to top left, rgba(255, 250, 217, 0.5), rgba(203, 251, 225, 0.5));
}

.dashboard .dashboard-card.to-right-gradient {
   background-image: linear-gradient(to top right, rgba(255, 250, 217, 0.5), rgba(203, 251, 225, 0.5));
}

.dashboard .dashboard-card .d-card-header {
   display: flex;
   align-items: center;
   margin-bottom: 1.5rem;
}

.dashboard .dashboard-card .d-card-header .icon-holder {
   width: 3rem;
   height: 3rem;
   background-color: var(--light);
   border-radius: 12px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-left: 0.75rem;
}

.dashboard .dashboard-card .d-card-header .icon-holder .icon {
   font-size: 1.5rem;
   color: var(--danger);
}

.dashboard .dashboard-card .d-card-header .d-card-title {
   font-size: 1.125rem;
   margin-bottom: 0;
   font-weight: 500;
}

.dashboard .dashboard-card .d-card-body {
   display: flex;
   flex-direction: column;
   background-color: var(--light);
   border-radius: 12px;
}

.dashboard .dashboard-card .d-card-body .info-item {
   padding: 1.25rem 1rem 0.875rem 1rem;
   border-radius: 12px;
   display: flex;
   align-items: center;
   transition: all 0.25s ease-in-out;
}

.dashboard .dashboard-card .d-card-body .info-item:hover {
   background-color: var(--third-gray);
}

.dashboard .dashboard-card .d-card-body .info-item>span {
   margin-left: 0.5rem;
}

.dashboard .dashboard-card .d-card-body.table-view .info-item {
   justify-content: space-between;
   padding: 0.625rem 1rem;
}

.dashboard .dashboard-card .d-card-body .info-item>a {
   width: 100%;
   color: var(--dark);
}

.dashboard .dashboard-card .d-card-body .info-item>a:hover {
   color: var(--danger);
}

/* /dashboard */

/* user info */

.user-info .form-group {
   margin-bottom: 2.5rem;
}

.user-info .ar-btn {
   margin-top: 1.875rem;
}

/* /user info */

/* ticket */

.pb-table {
   display: flex;
   flex-direction: column;
}

.pb-table .table-header {
   display: table;
   width: 100%;
   padding: 1.875rem 1.25rem 1rem 1.25rem;
   table-layout: fixed;
   border-bottom: 1px solid #EEEEEE;
}

.pb-table .table-header .th-header-item {
   display: table-cell;
   word-break: break-word;
   text-align: center;
}

.pb-table .table-header .th-header-item span {
   font-size: 1rem;
}

.pb-table .table-body {
   display: flex;
   flex-direction: column;
   padding: 1.25rem;
}

.pb-table .table-body .tb-row {
   display: table;
   width: 100%;
   table-layout: fixed;
   padding: 1.75rem 0;
   background-color: inherit;
   background-color: var(--third-gray);
   border-radius: 20px;
}

.pb-table .table-body .tb-row:not(:last-child) {
   margin-bottom: 1.125rem;
}

.pb-table .table-body .tb-row .tb-row-item {
   display: table-cell;
   word-break: break-word;
   text-align: center;
}

.pb-table .table-body .tb-row .tb-row-item span {
   font-size: 0.875rem;
}

.pb-table .table-body .tb-row .tb-row-item .status::before {
   content: '';
   width: 0.5rem;
   height: 0.5rem;
   border-radius: 50%;
   display: inline-block;
   vertical-align: middle;
   margin-left: 0.5rem;
}

.pb-table .table-body .tb-row .tb-row-item .status.primary::before {
   background-color: #D9D8D8;
}

.pb-table .table-body .tb-row .tb-row-item .status.secondary::before {
   background-color: var(--primary);
}

.pb-table .table-body .tb-row .tb-row-item .status.success::before {
   background-color: #3ACCA3;
}

.pb-table .table-body .tb-row .tb-row-item .status.danger::before {
   background-color: var(--danger);
}

.pb-table .table-body .tb-row .tb-row-item .responsive-title {
   display: none;
}

/* /ticket */

/* add new ticket */

.base-card .b-card-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 1.875rem;
}

.base-card .b-card-header .b-card-title {
   font-size: 1rem;
   font-weight: 500;
   margin-bottom: 0;
}

.form-input-holder .select2-container {
   display: block;
   width: 100% !important;
}

.select2-container--default .select2-selection--single.form-control {
   background-color: var(--third-gray);
   border-radius: 24px;
   border-color: var(--third-gray);
   height: fit-content;
   position: relative;
   z-index: 1;
}

.select2-container--default .select2-selection--single.form-control .select2-selection__rendered {
   line-height: 2.875rem;
}

.select2-container--default .select2-selection--single.form-control .select2-selection__arrow {
   width: 1.5rem;
   height: 1.5rem;
   top: 0;
   bottom: 0;
   margin: auto;
   left: 1rem;
   font-family: 'icomoon';
   font-size: 1.5rem;
   display: flex;
   justify-content: center;
   align-items: center;
   color: var(--green);
}

.select2-container--default .select2-selection--single.form-control .select2-selection__arrow::before {
   content: "\e92c";
}

.select2-container--default .select2-selection--single.form-control .select2-selection__arrow b {
   display: none;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single.form-control {
   border-radius: 24px;
   border-color: var(--green);
   background-color: var(--light);
}

.select2-container--open .select2-dropdown--below.custom-dropdown {
   top: -2rem;
   z-index: 0;
   padding-top: 3rem;
   border-radius: 0 0 24px 24px;
   border: none;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
}

.select2-container--open .select2-dropdown--above.custom-dropdown {
   top: 2rem;
   z-index: 0;
   padding-bottom: 3rem;
   border-radius: 24px 24px 0 0;
   border: none;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--single.form-control {
   border-radius: 24px;
   border-color: var(--green);
   background-color: var(--light);
}

.custom-dropdown .select2-results__option {
   font-size: 0.875rem;
   padding: 0.5rem 1rem;
}

.select2-dropdown--below.custom-dropdown .select2-results__option:last-child {
   border-radius: 0 0 24px 0;
}

.select2-dropdown--above.custom-dropdown .select2-results__option:first-child {
   border-radius: 0 24px 0 0;
}

.select2-container--default .custom-dropdown .select2-results>.select2-results__options {
   max-height: 7rem;
}

.select2-container--default .custom-dropdown .select2-results__option--highlighted.select2-results__option--selectable {
   background-color: var(--primary);
}


.select2-container--default .custom-dropdown .select2-results__option--selected {
   background-color: var(--second-gray);
}

.select2-container--default .custom-dropdown .select2-results>.select2-results__options::-webkit-scrollbar {
   width: 24px;
   background-color: transparent;
}

.select2-container--default .custom-dropdown .select2-results>.select2-results__options::-webkit-scrollbar-track {
   box-shadow: inset 0 0 10px 10px #EEEEEE;
   border: solid 8px transparent;
   background-color: transparent;
   border-radius: 30px
}

.select2-container--default .custom-dropdown .select2-results>.select2-results__options::-webkit-scrollbar-thumb {
   box-shadow: inset 0 0 10px 10px var(--primary);
   border: solid 8px transparent;
   background-color: transparent;
   border-radius: 30px
}

.uploader_box {
   padding: 1.875rem;
   background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='16' ry='16' stroke='%23E5E5E5FF' stroke-width='2' stroke-dasharray='11' stroke-dashoffset='15' stroke-linecap='square'/%3e%3c/svg%3e");
   border-radius: 16px;
   margin-bottom: 1.875rem;
}

.uploader_box .pb-uploader-input {
   width: 100%;
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   height: 100%;
   opacity: 0;
   cursor: pointer;
}

.uploader_box .upload_btn {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
}

.uploader_box .upload_btn:hover {
   cursor: pointer;
}

.uploader_box .upload_btn .icon {
   color: var(--green);
   font-size: 1.5rem;
   margin-bottom: 1rem;
}

.uploader_box .upload_btn span {
   font-size: 0.875rem;
   font-weight: 300;
   color: var(--dark);
}

.uploaded-item {
   max-width: 5.375rem;
   height: 5.375rem;
   box-shadow: 1px 2px 20px 0 rgba(0, 0, 0, 0.04);
   position: relative;
   display: inline-block;
   margin-left: 1rem;
   margin-top: 1rem;
}

.uploaded-item img {
   max-width: 100%;
   height: 100%;
   border-radius: 10px;
   object-fit: cover;
}

.delete {
   background-color: transparent;
   border: none;
   padding: 0;
   color: var(--danger);
   display: inline-flex;
   position: absolute;
   top: -0.625rem;
   right: -0.625rem;
}

/* /add new ticket */

/* favorites */

.blog-sec .blog-card .blog-img-holder img {
   max-width: 100%;
}

.blog-sec.fav .blog-card {
   margin-bottom: 1.875rem;
}

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

.blog-sec.fav .blog-card .blog-card-footer .delete {
   position: static;
}

/* /favorites */

/* ticket reply */

.collapse-btn {
   position: relative;
}

.collapse-btn .ar-btn {
   margin-bottom: 1.875rem;
}

.collapse-btn .ar-btn::before {
   content: "";
   width: 100%;
   border-bottom: 1px solid #E5E5E5;
   position: absolute;
   left: 0;
   right: 0;
   top: 0.75rem;
}

.gray-card {
   background-color: var(--third-gray);
   border-radius: 16px;
}

.gray-card.p-20 {
   padding: 1.25rem;
   margin-bottom: 0.625rem;
}

.base-card .reply-date {
   font-size: 0.75rem;
   margin-bottom: 1.875rem;
}

.gray-card p {
   font-weight: 300;
}

.gray-card p.mb-14 {
   margin-bottom: 0.875rem;
}

.gray-card .attached-file {
   display: flex;
   justify-content: space-between;
   align-items: center;
   background-color: var(--light);
   border-radius: 24px;
   padding: 0.75rem 1.25rem;
}

.gray-card .attached-file span {
   display: flex;
   align-items: center;
}

.gray-card .attached-file span .icon {
   font-size: 1.5rem;
   color: var(--green);
   margin-left: 0.5rem;
}

.gray-card .attached-file .download-btn {
   background-color: transparent;
   border: none;
   padding: 0;
   margin: 0;
   color: var(--primary);
   display: flex;
}

.gray-card .attached-file .download-btn .icon {
   font-size: 1.5rem;
}

.gray-card.p-16 {
   display: flex;
   flex-direction: column;
   padding: 1rem;
}

/* /ticket reply */

/* orders */

.pb-table .table-body .tb-row .tb-row-item .text-primary {
   color: var(--green) !important;
   margin-left: 0.25rem;
}

/* /orders */

/* order details */

.base-card .base-card-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   border-bottom: 1px solid #EEEEEE;
   padding-bottom: 1.75rem;
}

.base-card .base-card-header.column-item {
   flex-direction: column;
   padding-top: 1.875rem;
   margin-bottom: 1.25rem;
}

.base-card .base-card-header.column-item .b-card-header-item {
   width: 100%;
   justify-content: space-between;
}

.base-card .base-card-header.column-item .b-card-header-item:not(:last-child) {
   margin-bottom: 1.25rem;
}

.base-card .base-card-header .b-card-header-item {
   display: flex;
   align-items: center;
}

.base-card .base-card-header .b-card-header-item .title {
   font-weight: 500;
   margin-left: 1rem;
}


.base-card .base-card-header .b-card-header-item .text-primary {
   color: var(--green) !important;
}

.base-card .det-table-header {
   display: flex;
   justify-content: center;
   padding: 0.875rem 0;
   background-color: #3ACCA3;
   border-radius: 8px;
   color: var(--light);
   margin-bottom: 0.625rem;
}

.base-card .det-table-item {
   padding: 0.875rem 1.25rem;
   background-color: var(--third-gray);
   margin-bottom: 0.625rem;
   border-radius: 8px;
}

/* /order details */

/* financial */

.ar-badge {
   text-align: center;
   line-height: 2.25rem;
   border-radius: 24px;
   font-size: 0.875rem;
   display: inline-block;
   padding: 0 1rem;
}

.ar-badge.ar-badge-secondary {
   background-color: var(--light_gray);
}

.ar-badge.ar-badge-danger {
   background-color: var(--danger);
   color: var(--light)
}

.ar-badge.ar-badge-success {
   background-color: var(--secondary);
}

/* /financial */

/* financial details */

.text-danger {
   color: var(--danger) !important;
}

/* /financial details */

/* swal */

.swal2-container.swal2-backdrop-show.custom-swal-container {
   background-color: rgba(1, 1, 253, 0.2);
   backdrop-filter: blur(5px);
}

.swal2-popup.custom-swal-popup {
   padding: 1.875rem;
   border-radius: 16px;
}

.swal2-title.custom-swal-title {
   font-size: 1.5rem;
   font-family: 'Rokh';
   color: var(--primary);
   font-weight: bold;
   margin-bottom: 1.25rem;
}

.swal2-styled.swal2-confirm.custom-swal-confirmButton {
   font-size: 1rem;
   margin: 0 0.375rem;
   padding: 0 3.625rem;
   line-height: 3rem;
   border-radius: 24px;
}

.swal2-styled.swal2-confirm.custom-swal-confirmButton:focus {
   box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
}

.swal2-styled.swal2-cancel.custom-swal-cancelButton {
   border-radius: 24px;
   margin: 0 0.375rem;
   padding: 0 3.625rem;
   line-height: 3rem;
   color: var(--primary);
}

.swal2-styled.swal2-cancel.custom-swal-cancelButton:focus {
   box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
}

/* /swal */

/* 404 page */

.not-found-section {
   background: url(../img/sky.svg) no-repeat center 80px;
   background-size: 980px 254px;
   width: 100%;
   height: 100vh;
   align-items: center;
   display: flex;
}

.not-found-section .wave1 {
   position: absolute;
   left: 0;
   right: 0;
   bottom: -2rem;
   z-index: 0;
}

.not-found-section .wave2 {
   position: absolute;
   right: -0.5rem;
   bottom: -9rem;
   z-index: -1;
}

.not-found-section .nf-details {
   display: flex;
   flex-direction: column;
   align-items: center;
}

.not-found-section .nf-details .text-danger {
   font-size: 1.75rem;
   color: var(--danger);
   margin-bottom: 0.5rem;
}

.not-found-section .nf-details .text-gray {
   font-size: 4.5rem;
   color: #BFBFBF;
   font-family: Roboto;
   margin-bottom: 2.5rem;
}

.not-found-section .nf-details .title {
   font-family: 'Rokh';
   font-size: 1.5rem;
   margin-bottom: 1.875rem;
}

/* /404 page */
tr.header-row {
    background-color: #6567FC;
    color: #fff;
}
.header-row td {
    border: none !important;
}
.description-item .description {
    background: white;
    padding: 30px;
    border-radius: 28px;
}
h1,h2,h3,h4,h5,h6 {
    font-family: Rokh;
    margin: 0;
}

.h1,h1 {
    font-size: 2rem;
}

.h2,h2 {
    font-size: 1.75rem;
}

.h3,h3 {
    font-size: 1.5rem;
}
.h4,h4 {
    font-size: 1.25rem;
}

.h5,h5 {
    font-size: 1.125rem;
}