.body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; font-family: "-apple-system", "BlinkMacSystemFont", "San Francisco", "Roboto", "Almarai", "Helvetica Neue", "Manrope", "sans-serif"; color: #333; background-color: #f6f9fc; min-height: 100vh; } body>* { -ms-flex-negative: 0; flex-shrink: 0; } h1, h2, h3, h4, h5, h6 { line-height: 1.4; } ::-moz-selection { background-color: var(--primaryColor); color: #fff; } ::selection { background-color: var(--primaryColor); color: #fff; } .text-muted { color: #888 !important; } .red { color: red; } .mt-80 { margin-top: 80px; } .mb-80 { margin-bottom: 80px; } ::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { background: #eee; } ::-webkit-scrollbar-thumb { background: #d3d3d6; } ::-webkit-scrollbar-thumb:hover { background: #a0a0a0; } .simplebar-content-wrapper { -webkit-box-sizing: content-box; box-sizing: content-box; } .text-normal { -o-text-overflow: clip !important; text-overflow: clip !important; -webkit-line-clamp: unset !important; } p { margin-bottom: 0; } a { color: var(--secondaryColor); text-decoration: none; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } a:hover { color: var(--secondaryColor); opacity: .9; } .link { cursor: pointer; } .bg-light { background-color: #f6f9fc !important; } .logo { display: inline-block; height: 35px; } .logo img { height: 100%; } .icon-color { fill: var(--secondaryColor); } .breadcrumb { --bs-breadcrumb-divider: '/'; margin-bottom: 0; } .breadcrumb-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .breadcrumb-item.active { color: #888; } .breadcrumb-item.active::before { color: #999; } .file-password { text-align: center; width: 100%; } .file-password .file-password-icon { 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; width: 70px; height: 70px; background-color: var(--secondaryColor); margin-right: auto; margin-left: auto; border-radius: 50%; color: #fff; margin-bottom: 16px; } .file-password .file-password-icon i { font-size: 30px; } .file-password .file-password-title { font-size: 25px; margin-bottom: 5px; } @media (max-width: 767.98px) { .file-password .file-password-title { font-size: 19px; } } .file-password .file-password-text { color: #888; } .btn { -webkit-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-box-shadow: none !important; box-shadow: none !important; padding-right: 20px; padding-left: 20px; border-radius: 5px; } .btn.btn-md { padding: 10px 20px; } .btn.btn-lg { padding: 12px 20px; font-size: 16px; } .btn[class*="-icon"] { position: relative; 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; } .btn[class*="-icon"] i { margin-left: 10px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .btn[class*="-icon"]:hover i { -webkit-transform: translate(10px); -ms-transform: translate(10px); transform: translate(10px); } .btn.btn-primary-icon { background-color: var(--primaryColor); border-color: var(--primaryColor); color: #fff; } .btn.btn-secondary-icon { background-color: #fff; border-color: #fff; color: var(--primaryColor); } .btn.btn-primary { background-color: var(--primaryColor); border-color: var(--primaryColor); } .btn.btn-secondary { background-color: var(--secondaryColor); border-color: var(--secondaryColor); } .btn.btn-light { background-color: #fff; border-color: #fff; color: var(--primaryColor) !important; } .btn.btn-light:hover { color: var(--primaryColor) !important; } .btn.btn-outline-light { border-color: #eee; color: #444; } .btn.btn-outline-light:hover { background-color: #eee; } .btn:hover { opacity: .9; } .btn.btn-outline-primary { color: var(--primaryColor); border-color: var(--primaryColor); } .btn.btn-outline-primary:hover { background-color: var(--primaryColor); color: #fff; opacity: 1; } .btn.btn-outline-secondary { color: var(--secondaryColor); border-color: var(--secondaryColor); } .btn.btn-outline-secondary:hover { background-color: var(--secondaryColor); color: #fff; opacity: 1; } .btn-close { -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); } .btn-close:active, .btn-close:focus { -webkit-box-shadow: none; box-shadow: none; } .social-btn { 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; width: 45px; height: 45px; border-radius: 50%; color: #fff; border: 0; outline: 0; cursor: pointer; } .social-btn i { font-size: 18px; } .social-btn.social-facebook { background-color: #1877f2; } .social-btn.social-twitter { background-color: #1da1f2; } .social-btn.social-linkedin { background-color: #0a66c2; } .social-btn.social-whatsapp { background-color: #25d366; } .social-btn.social-pinterest { background-color: #cc0200; } .social-btn.social-link { background-color: #8C95A0; } .social-btn:hover { opacity: .8; color: #fff; } .input-group button { border-top-right-radius: .25rem; border-bottom-right-radius: .25rem; } .form-control { border-color: #ddd; } .form-control:focus { -webkit-box-shadow: none; box-shadow: none; border-color: var(--primaryColor); } .form-control.form-control-md { font-size: 16px; padding-top: 10px; padding-bottom: 10px; } .form-control.form-control-lg { padding-top: 12px; padding-bottom: 12px; } .form-control:disabled, .form-control[readonly] { background-color: #eee; } .form-select { border-color: #ddd; } .form-select:focus { -webkit-box-shadow: none; box-shadow: none; border-color: var(--primaryColor); } .form-select.form-select-md { font-size: 16px; padding-top: 10px; padding-bottom: 10px; } .form-select.form-select-lg { padding-top: 12px; padding-bottom: 12px; } .form-select:disabled, .form-select[readonly] { background-color: #eee; } .form-search { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .form-search input { padding: 15px 65px 15px 25px; border: 1px solid #ecf2f6; border-radius: 10px; width: 100%; } .form-search input:focus { outline: 0; border-color: var(--primaryColor); } .form-search button { position: absolute; right: 0; outline: 0; border: 0; background: transparent; color: #ccc; width: 65px; height: 100%; text-align: center; } .form-check .form-check-input { -webkit-box-shadow: none !important; box-shadow: none !important; } .form-check .form-check-input:checked { background-color: var(--primaryColor); border-color: var(--primaryColor); } .form-check .form-check-input:focus { border-color: var(--primaryColor); } .form-number { display: -webkit-box; display: -ms-flexbox; display: flex; } .form-number .form-select { border-top-right-radius: 0; border-bottom-right-radius: 0; border-right: 0; height: auto; } .form-number .form-select:focus { border-color: #ced4da; } .form-number .form-control { border-top-left-radius: 0; border-bottom-left-radius: 0; } .form-button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; } .form-button .form-control { padding-right: 50px; } .form-button button { position: absolute; top: 0; right: 0; outline: 0; border: 0; background: transparent; height: 100%; width: 50px; color: var(--primaryColor); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .form-button button:hover { opacity: .9; } .input-icon { position: relative; } .input-icon .form-control { border-radius: .25rem !important; padding-right: 50px; } .input-icon button { position: absolute; top: 0; right: 0; width: 50px; height: 100%; background: transparent; border: 0; outline: 0; z-index: 5; color: #999; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .input-icon button:hover { opacity: .8; } .textarea-btn { position: relative; width: 100%; } .textarea-btn .btn { visibility: hidden; position: absolute; top: 8px; right: 8px; -webkit-transition: .2s; -o-transition: .2s; transition: .2s; opacity: 0; font-size: 12px; padding: 0.15rem 0.65rem; border-radius: 200px; color: #fff; } .textarea-btn .btn:hover { opacity: .8; } .textarea-btn:hover button { visibility: visible; opacity: 1; } .form-switch.form-switch-lg { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .form-switch.form-switch-lg .form-check-input { width: 2.7rem; height: 1.3rem; margin-top: 0 !important; margin-right: 10px; } .form-switch.form-switch-lg .form-check-input:not(:checked):focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e"); } .form-switch.form-switch-lg .form-check-label { margin-top: .2rem; } .share { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-right: -5px; margin-left: -5px; } .share.v2 { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .share.v2 .social-btn { border-radius: 5px; width: 100%; height: 50px; } .share .social-btn { margin: 5px; } .page-slider { position: relative; overflow-x: hidden; } .page-slider .swiper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--primaryColor); z-index: unset; } .page-slider .swiper .swiper-wrapper { z-index: unset; } .page-slider .swiper-bg { position: relative; width: 100%; height: 100%; background-size: cover; background-position: center center; } .page-slider .swiper-bg::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.38); } .page-slider .swiper-slide { overflow: hidden; } .page-slider .swiper-video-container { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .page-slider .swiper-video-container video { width: 150%; height: 150%; -o-object-fit: cover; object-fit: cover; } .page-slider .swiper-video-container::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.38); } .header { 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; position: relative; background-size: cover; background-position: center; width: 100%; min-height: 100vh; padding-top: 100px; padding-bottom: 100px; } .header .nav-bar { position: fixed; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 80px; top: 0; left: 0; z-index: 1000; } @media (max-width: 1100px) { .header .nav-bar { height: 60px; } } .header .nav-bar .drop-down .drop-down-btn { color: #fff; } .header .nav-bar .drop-down .drop-down-btn:hover { color: var(--secondaryColor); } .header .nav-bar .nav-bar-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .header .nav-bar .logo { height: 30px; } .header .nav-bar .logo img { height: 75%; } /* .header .nav-bar .logo img:last-child { display: none; } */ @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu { visibility: hidden; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; z-index: 1030; } } .header .nav-bar .nav-bar-menu .overlay { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .overlay { display: block; } } .header .nav-bar .nav-bar-menu .nav-bar-links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .nav-bar-links { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; width: 300px; height: 100%; background-color: #fff; top: 0; right: -300px; padding: 20px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; z-index: 1000; overflow: hidden auto; } } .header .nav-bar .nav-bar-menu .nav-bar-links>*:not(:last-child) { margin-right: 25px; } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .nav-bar-links>*:not(:last-child) { margin-right: 0; } } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { color: #FFF; cursor: pointer; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link:hover { color: var(--secondaryColor) !important; } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { color: #444; font-size: 16px; margin-top: 5px; margin-bottom: 5px; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link.btn { width: 100%; padding-top: 6px; padding-bottom: 6px; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link.btn.btn-outline-light { border-color: var(--primaryColor) !important; color: var(--primaryColor) !important; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link.btn.btn-outline-light:hover { background-color: var(--primaryColor) !important; color: #FFF !important; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link.btn.btn-light { background-color: var(--primaryColor) !important; border-color: var(--primaryColor) !important; color: #FFF !important; } } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .nav-bar-links .drop-down .drop-down-btn { color: #222; margin-top: 5px; margin-bottom: 10px; } .header .nav-bar .nav-bar-menu .nav-bar-links .drop-down .drop-down-btn:hover { color: var(--secondaryColor); } } @media (max-width: 1100px) { .header .nav-bar .nav-bar-menu .nav-bar-links .drop-down .drop-down-menu { width: 100%; } } .header .nav-bar .nav-bar-menu.active { visibility: visible; opacity: 1; } .header .nav-bar .nav-bar-menu.active .nav-bar-links { right: 0; } .header .nav-bar .nav-bar-menu-icon { cursor: pointer; color: #FFF; } .header .nav-bar.active { background-color: #131517; -webkit-box-shadow: 0 16px 24px 2px #14244105, 0 6px 32px 4px #1424410a, 0 8px 12px -5px #1424410a; box-shadow: 0 16px 24px 2px #14244105, 0 6px 32px 4px #1424410a, 0 8px 12px -5px #1424410a; } .header .nav-bar.active .logo img { display: none; } .header .nav-bar.active .logo img:last-child { display: block; } .header .nav-bar.active .nav-bar-links .nav-bar-link { color: #222; } .header .nav-bar.active .nav-bar-links .btn.btn-outline-light { border-color: var(--primaryColor) !important; color: var(--primaryColor) !important; } .header .nav-bar.active .nav-bar-links .btn.btn-outline-light:hover { background-color: var(--primaryColor) !important; color: #FFF !important; } .header .nav-bar.active .nav-bar-links .btn.btn-light { background-color: var(--primaryColor) !important; border-color: var(--primaryColor) !important; color: #FFF !important; } @media (max-width: 1100px) { .header .nav-bar.active .nav-bar-links .drop-down .drop-down-btn { color: #444; margin-top: 5px; margin-bottom: 10px; } } @media (max-width: 1100px) { .header .nav-bar.active .nav-bar-links .drop-down .drop-down-menu { width: 100%; } } .header .nav-bar.active .nav-bar-menu-icon { color: #029FA2; } .header .nav-bar.active .drop-down .drop-down-btn { color: #222; } .header .header-content { position: relative; width: 100%; margin-top: 30px; } .header .header-content .header-content-icon { display: inline-block; font-size: 80px; margin-bottom: 20px; cursor: pointer; color: var(--secondaryColor); -webkit-animation: bounce 2.5s infinite; animation: bounce 2.5s infinite; } .header.v2 { position: relative; 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; min-height: 0; height: 300px; padding-top: 100px; padding-bottom: 80px; /*background-color: var(--primaryColor);*/ } .header.v2 [class~="container"] { position: relative; z-index: 1; } .header.v2 .breadcrumb-item { color: #fff; } .header.v2 .breadcrumb-item::before { color: #fff; } .header.v2 .breadcrumb-item a { color: #fff; } .header.v2::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-height: unset; background-image: url('../../images/pattern-bg.png'); background-size: 5%; opacity: .07; background-position: center center; z-index: 0; } .header.v2 .nav-bar.active .nav-bar-links .nav-bar-link:hover { color: var(--primaryColor); } .header.v2 .nav-bar.active .drop-down .drop-down-btn:hover { color: var(--primaryColor); } .header.v2 .nav-bar .nav-bar-links .nav-bar-link:hover { color: #222; } .header.v2 .nav-bar .drop-down .drop-down-btn:hover { color: var(--secondaryColor); } .header.v3 { min-height: 0; height: 70px; background: none; padding: 0; } @media (max-width: 991.98px) { .header.v3 { height: 60px; } } .header.v3::before { display: none; } .header.v3 .nav-bar { background-color: #fff; -webkit-box-shadow: 0 16px 24px 2px #14244105, 0 6px 32px 4px #1424410a, 0 8px 12px -5px #1424410a; box-shadow: 0 16px 24px 2px #14244105, 0 6px 32px 4px #1424410a, 0 8px 12px -5px #1424410a; } .header.v3 .nav-bar .logo img { display: none; } .header.v3 .nav-bar .logo img:last-child { display: block; } .header.v3 .nav-bar .nav-bar-links .nav-bar-link { color: #222; } .header.v3 .nav-bar .nav-bar-links .drop-down .drop-down-btn { color: #222; } .header.v3 .nav-bar .nav-bar-links .btn.btn-outline-light { border-color: var(--primaryColor) !important; color: var(--primaryColor) !important; } .header.v3 .nav-bar .nav-bar-links .btn.btn-outline-light:hover { background-color: var(--primaryColor) !important; color: #FFF !important; } .header.v3 .nav-bar .nav-bar-links .btn.btn-light { background-color: var(--primaryColor) !important; color: #FFF !important; } .header.v3 .nav-bar .nav-bar-menu-icon { color: #222; } .drop-down { position: relative; } .drop-down .drop-down-btn { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; color: #222; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .drop-down .drop-down-btn:hover { color: var(--primaryColor); opacity: .9; } .drop-down .drop-down-menu { position: absolute; background-color: #fff; min-width: 180px; border-radius: 5px; top: 35px; right: 0; visibility: hidden; opacity: 0; -webkit-transform: perspective(200px) translateZ(-200px); transform: perspective(200px) translateZ(-200px); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; } .drop-down .drop-down-menu .drop-down-divider { border-top: 1px solid #eee; } .drop-down .drop-down-menu .drop-down-item { display: block; padding: 8px 10px; color: #555; } .drop-down .drop-down-menu .drop-down-item i { width: 25px; } .drop-down .drop-down-menu .drop-down-item:first-child { border-top-right-radius: 4px; border-top-left-radius: 4px; } .drop-down .drop-down-menu .drop-down-item:last-child { border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .drop-down .drop-down-menu .drop-down-item.active { background-color: #fff; color: var(--primaryColor) !important; } .drop-down .drop-down-menu .drop-down-item:hover { background-color: var(--primaryColor); color: #fff !important; } .drop-down.active { z-index: 1000; } .drop-down.active .drop-down-menu { visibility: visible; opacity: 1; -webkit-transform: perspective(200px) translateZ(0); transform: perspective(200px) translateZ(0); } .user-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1199.98px) { .user-menu { margin-right: 16px; } } .user-menu .user-img { margin-right: 10px; border-radius: 50%; width: 35px; height: 35px; } @media (max-width: 575.98px) { .user-menu .user-img { margin-right: 0; width: 30px; height: 30px; } } @media (max-width: 575.98px) { .user-menu .user-name, .user-menu i { display: none; } } .user-menu .drop-down-menu { top: 40px; } .section { padding-top: 80px; padding-bottom: 80px; overflow: hidden; } .section .section-inner .section-header { margin-bottom: 45px; } .section .section-inner .section-header .section-title { 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; color: var(--primaryColor); margin-bottom: 16px; } .section .section-inner .section-header .section-title h5 { margin-bottom: 0; font-weight: 500; font-size: 30px; } .section .section-inner .section-header .section-title::after { content: ''; width: 40px; height: 3px; margin-top: 5px; margin-right: 5px; background-color: var(--primaryColor); border-radius: 50px; } .section .section-inner .section-header .section-text { font-size: 17px; font-weight: 300; color: #666; } .section .section-inner .section-header .section-text p { margin-bottom: 0; } @media (max-width: 991.98px) { .section { padding-top: 50px; padding-bottom: 50px; } } .section.v3 { position: relative; background-color: var(--secondaryColor); } .section.v3::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-height: unset; background-image: url('../../images/pattern-bg.png'); background-size: 5%; opacity: .08; background-position: center center; z-index: 0; } .section.v3>* { position: relative; z-index: 1; } .faqs, .contact-us { max-width: 900px; margin-right: auto; margin-left: auto; } .card-v { -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); padding: 40px; background-color: #fff; border-radius: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (max-width: 575.98px) { .card-v { padding: 20px; } } .card-v.v2 { padding: 21px; } .card-v.v2 .card-v-title { font-weight: 500; font-size: 20px; } .card-v.v3 { padding: 20px; } @media (max-width: 575.98px) { .card-v.v3 { padding: 10px; } } .card-v .card-v-icon { 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; background-color: #f6f9fc; width: 80px; height: 80px; border-radius: 50%; margin-bottom: 16px; margin-right: auto; margin-left: auto; } .card-v .card-v-icon svg, .card-v .card-v-icon img { width: 40px; } .card-v .card-v-title { font-weight: 400; font-size: 18px; margin-bottom: 12px; } .card-v .card-v-text { font-weight: 300; color: #888; } .card-v .card-v-header { padding: 20px; } .card-v .card-v-body { padding: 20px; } .blog-post { background-color: #fff; -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); border-radius: 10px; } .blog-post .blog-post-header { position: relative; } .blog-post .blog-post-header .blog-post-cate { bottom: 20px; left: 20px; position: absolute; -ms-flex-item-align: start; align-self: flex-start; padding: 5px 15px; font-size: 14px; background-color: var(--secondaryColor); border-radius: 200px; color: #fff; opacity: 1; } .blog-post .blog-post-img { border-top-right-radius: 10px; border-top-left-radius: 10px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .blog-post .blog-post-body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 25px; } .blog-post .blog-post-title { font-size: 18px; font-weight: 500; margin-bottom: 5px; color: var(--secondaryColor); } .blog-post .blog-post-title h6 { font-size: 18px; margin-bottom: 0; } .blog-post .blog-post-text { color: #888; font-weight: 300; font-size: 15px; } .blog-post .blog-post-footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 25px 25px; } .posts .post { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .posts .post:not(:last-child) { margin-bottom: 16px; } .posts .post .post-img { border-radius: 10px; margin-right: 10px; width: 60px; height: 60px; -o-object-fit: cover; object-fit: cover; } .posts .post .post-info .post-title { font-weight: 400; margin-bottom: 5px; letter-spacing: .5px; } .posts .post .post-info .post-title a { color: var(--secondaryColor); } .post-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .post-meta .post-meta-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #888; font-size: 14px; margin-top: 2px; margin-bottom: 2px; } .post-meta .post-meta-item:not(:last-child) { margin-right: 10px; } .post-meta .post-meta-item:not(:last-child)::after { content: ''; width: 5px; height: 5px; background-color: #999; margin-left: 10px; border-radius: 50%; } .post-meta .post-meta-item i { margin-right: 5px; } .accordion-custom.v2 .accordion-button { border-radius: 200px; border: 1px solid transparent; background-color: #fff; } .accordion-custom .accordion-item { background: transparent; border: 1px solid transparent; } .accordion-custom .accordion-item:not(:last-child) { margin-bottom: 16px; } .accordion-custom:first-of-type .accordion-button.collapsed, .accordion-custom:last-of-type .accordion-button.collapsed { border-radius: 10px; } .accordion-custom .accordion-button { border-radius: 200px; border: 1px solid transparent; background-color: #f9f9f9; } .accordion-custom .accordion-button:not(.collapsed) { -webkit-box-shadow: none; box-shadow: none; border: 1px solid #eee; border-radius: 10px 10px 0 0; color: #333; } .accordion-custom .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,"); } .accordion-custom .accordion-button:focus { -webkit-box-shadow: none; box-shadow: none; } .accordion-custom .accordion-body { border: 1px solid #eee; border-top: 0; background-color: #fff; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; } .footer { background-color: #f6f9fc; padding: 30px 0; margin-top: auto; border-top: 1px solid #eee; } .footer .footer-links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .footer .footer-links .link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 14px; } .footer .footer-links .link:not(:last-child) { margin-right: 8px; } .footer .footer-links .link:not(:last-child)::after { content: ''; width: 7px; height: 7px; background-color: var(--secondaryColor); opacity: .6; border-radius: 50%; margin-left: 8px; } .footer .footer-links .link a { color: var(--primaryColor); } .footer .footer-copyright { font-size: 14px; color: #777; } .page-item:not(:last-child) { margin-right: 6px; } .page-item .page-link { color: var(--primaryColor); padding-right: 15px; padding-left: 15px; border-radius: 5px !important; border: 0; background: transparent; } .page-item .page-link:focus, .page-item .page-link:active { -webkit-box-shadow: none !important; box-shadow: none !important; } .page-item .page-link:hover { background: var(--primaryColor); color: #fff; } .page-item.active .page-link { background-color: var(--primaryColor); border-color: var(--primaryColor); color: #fff; } .page-item.active .page-link:hover { color: #fff; } .page-item[disabled] .page-link { cursor: default; background: transparent; color: var(--primaryColor); } .comments { width: 100%; } .comments .comments-title { margin-bottom: 25px; } .comments .comment { display: -webkit-box; display: -ms-flexbox; display: flex; background-color: #fafafa; padding: 30px 20px; border-radius: 10px; } .comments .comment .comment-img img { width: 70px; height: 70px; border-radius: 50%; margin-right: 16px; } .comments .comment .comment-text { font-size: 15px; } .comments .comment:not(:last-child) { margin-bottom: 16px; } .dz-dragbox { position: fixed; visibility: hidden; top: 0; left: 0; width: 100%; height: 100%; color: #FFF; z-index: 10000; opacity: 0; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } @media (max-width: 991.98px) { .dz-dragbox { display: none; } } .dz-dragbox.show { visibility: visible; opacity: 1; } .dz-dragbox .dz-dragbox-inner { position: relative; 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; color: var(--white); width: 100%; height: 100%; padding: 40px; text-align: center; } .dz-dragbox .dz-dragbox-inner>* { z-index: 1; } .dz-dragbox .dz-dragbox-inner::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--primaryColor); opacity: .7; z-index: 0; } .dz-dragbox .dz-dragbox-inner::after { content: ''; position: absolute; top: 20px; left: 20px; width: calc(100% - 40px); height: calc(100% - 40px); 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='13' ry='13' stroke='%23fff' stroke-width='6' stroke-dasharray='20%2c 14' stroke-dashoffset='15' stroke-linecap='butt'/%3e%3c/svg%3e"); } .counter { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; } @media (max-width: 1399.98px) { .counter { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } } .counter .counter-icon { margin-right: 20px; } @media (max-width: 1399.98px) { .counter .counter-icon { margin-right: 0; margin-bottom: 20px; } } .counter .counter-icon i { font-size: 35px; } .counter .counter-icon img { width: 44px; } .counter .counter-info .counter-number { font-size: 30px; margin-bottom: 10px; } .counter .counter-info .counter-title { text-transform: uppercase; letter-spacing: 3px; } .plans .plans-item { display: none; } .plans .plans-item.active { display: block; } .plan { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; background-color: #fff; padding: 30px; height: 100%; border-radius: 10px; overflow: hidden; -webkit-box-shadow: 0 16px 24px 2px #0f040405, 0 6px 32px 4px #0f04040a, 0 8px 12px -5px #0f04040a; box-shadow: 0 16px 24px 2px #0f040405, 0 6px 32px 4px #0f04040a, 0 8px 12px -5px #0f04040a; } .plan>* { -ms-flex-negative: 0; flex-shrink: 0; } .plan.plan-featured { border: 2px solid var(--secondaryColor); } .plan.plan-featured .plan-badge { background-color: var(--secondaryColor); } .plan.plan-current { border: 2px solid var(--primaryColor); } .plan.plan-current .plan-badge { background-color: var(--primaryColor); } .plan .plan-badge { position: absolute; top: 15px; right: -115px; width: 300px; height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); color: #fff; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .plan .plan-title { font-size: 19px; font-weight: 500; margin-bottom: 5px; } .plan .plan-text { color: #777; font-size: 15px; margin-bottom: 10px; } .plan .plan-price { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 26px; font-weight: 500; color: var(--secondaryColor); } .plan .plan-price .plan-price-text { font-size: 14px; font-weight: 300; } .plan .plan-features { margin-top: 10px; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .plan .plan-features .plan-feature-item { display: -webkit-box; display: -ms-flexbox; display: flex; } .plan .plan-features .plan-feature-item .plan-feature-icon { margin-right: 5px; width: 20px; } .plan .plan-features .plan-feature-item .plan-feature-icon [class*="check"] { color: var(--secondaryColor); } .plan .plan-features .plan-feature-item .plan-feature-icon [class*="times"] { color: #dc3545; } .plan .plan-features .plan-feature-item:not(:last-child) { margin-bottom: 7px; } .plan .plan-action { margin-top: 15px; } .plan-switcher { position: relative; display: -webkit-box; display: -ms-flexbox; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; cursor: pointer; padding: 5px; background-color: #FFF; border: 1px solid var(--primaryColor); -webkit-box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset; box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset; border-radius: 200px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .plan-switcher .plan-switcher-item { position: relative; display: flex; align-items: center; justify-content: center; width: 90px; text-align: center; font-weight: 400; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; height: 35px; border-radius: 200px; } .plan-switcher .plan-switcher-item.active { background-color: var(--primaryColor); color: #fff; } .dropzone-wrapper .dropzone-drag { display: none; width: 100%; max-width: 750px; margin-right: auto; margin-left: auto; 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='13' ry='13' stroke='%23fff' stroke-width='6' stroke-dasharray='20%2c 14' stroke-dashoffset='15' stroke-linecap='butt'/%3e%3c/svg%3e"); border-radius: 13px; -webkit-transform: perspective(200px) translateZ(-50px); transform: perspective(200px) translateZ(-50px); -webkit-transition: .3s; -o-transition: .3s; transition: .3s; cursor: pointer; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner { 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; background-color: #fff; min-height: 350px; border-radius: 10px; text-align: center; padding: 40px 30px; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-icon { margin-bottom: 20px; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-icon i { font-size: 60px; color: var(--secondaryColor); } @media (max-width: 575.98px) { .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-icon i { font-size: 50px; } } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-title { font-weight: 500; font-size: 22px; color: var(--secondaryColor); margin-bottom: 6px; } @media (max-width: 767.98px) { .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-title { font-size: 18px; } } @media (max-width: 499.98px) { .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-title { font-size: 16px; } } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-text { color: #888; } @media (max-width: 575.98px) { .dropzone-wrapper .dropzone-drag .dropzone-drag-inner { min-height: 300px; } } @media (max-width: 399.98px) { .dropzone-wrapper .dropzone-drag .dropzone-drag-inner { min-height: 300px; } } .dropzone-wrapper .dropzone-drag:hover { padding: 20px; } @media (max-width: 1199.98px) { .dropzone-wrapper .dropzone-drag { padding: 20px; } } @media (max-width: 499.98px) { .dropzone-wrapper .dropzone-drag { padding: 10px; } .dropzone-wrapper .dropzone-drag:hover { padding: 10px; } } .dropzone-wrapper .dropzone-uploadbox { display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; max-width: 500px; min-height: 420px; margin-right: auto; margin-left: auto; background-color: #fff; border-radius: 10px; text-align: start; overflow: hidden; /* -webkit-transform: perspective(200px) translateZ(-50px); transform: perspective(200px) translateZ(-50px); */ -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .dropzone-wrapper .dropzone-uploadbox .dropzone-more { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; } .dropzone-wrapper .dropzone-uploadbox .dropzone-more i { font-size: 30px; color: var(--secondaryColor); } .dropzone-wrapper .dropzone-uploadbox .dropzone-more .dropzone-more-title { font-size: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-more .dropzone-more-text { color: #888; font-size: 14px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-reset { text-align: center; cursor: pointer; color: #666; font-size: 15px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper { position: relative; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files { padding: 0 20px; max-height: 300px; overflow: hidden auto; } /* .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms { display: none; } */ .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form { /* display: none; background-color: #fff; visibility: hidden; opacity: 0; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; */ } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-header .dropzone-form-title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-header .dropzone-form-title i { margin-right: 5px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-header .dropzone-form-close { cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-header .dropzone-form-close:hover { opacity: .8; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-body { padding-right: 20px; padding-left: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-edit .drop-down-btn { color: #666; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-edit .dropzone-form-edit-item { cursor: pointer; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-edit .dropzone-form-edit-item.active { color: var(--secondaryColor) !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form .dropzone-form-edit .dropzone-form-edit-item.active:hover { color: #fff !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form.show { display: block; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form.animation { visibility: visible; opacity: 1; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower { margin-top: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions { display: -webkit-box; display: -ms-flexbox; display: flex; padding-right: 20px; padding-left: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action { width: 100%; padding: 15px; text-align: center; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; border-radius: 5px; border: 1px solid #eee; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action:not(:last-child) { margin-right: 10px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action i { margin-right: 5px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action:hover, .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action.active { background-color: #eee; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action.selected { border-color: var(--secondaryColor); } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions .dropzone-form-action.selected:hover { background-color: var(--secondaryColor); color: #fff; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-uploadbox-submit { padding: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-uploadbox-submit button { width: 100%; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-submit { display: none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-submit>*:not(:last-child) { margin-right: 10px; } .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-uploadbox-header, .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-uploadbox-files { display: none; } .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-forms { display: block; } /* .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-uploadbox-submit { display: none; } */ .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-form-submit { display: -webkit-box; display: -ms-flexbox; display: flex; } .dropzone-wrapper.show-drag .dropzone-index { display: none; } .dropzone-wrapper.show-drag .dropzone-drag { display: block; } .dropzone-wrapper.show-drag .dropzone-uploadbox { display: none; } .dropzone-wrapper.show-uploadbox .dropzone-index { display: none; } .dropzone-wrapper.show-uploadbox .dropzone-drag { display: none; } .dropzone-wrapper.show-uploadbox .dropzone-uploadbox { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } /* .dropzone-wrapper.animation .dropzone-drag, .dropzone-wrapper.animation .dropzone-uploadbox { -webkit-transform: perspective(200px) translateZ(0); transform: perspective(200px) translateZ(0); } */ .dropzone { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-height: 0; padding: 0; border: 0; background: transparent; } .dropzone>* { -ms-flex-negative: 0; flex-shrink: 0; pointer-events: all; } .dropzone .dz-default { display: none; } .dropzone .dz-preview { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; margin: 0; min-height: 0; padding: 15px 20px; background-color: #eee; border-radius: 10px; height: 80px; } .dropzone .dz-preview.dz-image-preview { background-color: #eee; } .dropzone .dz-preview:not(:last-child) { margin-bottom: 10px; } .dropzone .dz-preview .dz-fileicon { width: 40px; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 10px; } .dropzone .dz-preview .dz-fileicon .vi.vi-file::before { border-top-color: #eee; border-right-color: #eee; } .dropzone .dz-preview .dz-fileicon img { height: 100%; width: 100%; border-radius: 5px; } .dropzone .dz-preview .dz-preview-content { width: calc(100% - 50px); } .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark { display: none; opacity: 1; position: static; margin: 0; margin-right: 5px; color: #20c997; -webkit-animation: unset !important; animation: unset !important; } .dropzone .dz-preview .dz-error-mark { color: #dc3545; } .dropzone .dz-preview .dz-details { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: static; min-width: 0; padding: 0; opacity: 1 !important; width: 100%; } .dropzone .dz-preview .dz-details .dz-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 13px; color: #222; } .dropzone .dz-preview .dz-details .dz-details-info { width: calc(100% - 40px); -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .dropzone .dz-preview .dz-details .dz-filename { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0; font-size: 15px; color: #222; } .dropzone .dz-preview .dz-details .dz-filename span { border: 0 !important; background: transparent !important; padding: 0; } .dropzone .dz-preview .dz-details .dz-size { margin-bottom: 0; font-size: 13px; color: #222; } .dropzone .dz-preview .dz-details .dz-size strong { font-weight: 500; } .dropzone .dz-preview .dz-details .dz-remove { position: absolute; right: 20px; top: 50%; background-color: var(--primaryColor); width: 25px; height: 25px; color: #fff; 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; border-radius: 50%; text-decoration: none; cursor: pointer; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: .2s; -o-transition: .2s; transition: .2s; } .dropzone .dz-preview .dz-details .dz-remove i { cursor: pointer; font-size: 14px; } .dropzone .dz-preview .dz-details .dz-remove:hover { opacity: .9; } .dropzone .dz-preview .dz-error-message { display: block; position: static; width: auto; height: auto; opacity: 1; padding: 0; background: transparent; color: #dc3545; font-size: 13px; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; width: calc(100% - 40px); } .dropzone .dz-preview .dz-error-message::after { display: none; } .dropzone .dz-preview .dz-progress { display: none; position: relative; opacity: 1; margin: 0; width: 100%; height: 4px; margin-top: 5px; width: calc(100% - 40px); } .dropzone .dz-preview .dz-progress .dz-upload { position: absolute; height: 100%; display: block; background: #20c997; border-radius: 2em; } .dropzone .dz-preview [data-dz-name] { -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; background: transparent !important; } .dropzone .dz-preview.dz-processing .dz-progress { display: block; } .dropzone .dz-preview.dz-complete .dz-progress { display: none; } .dropzone .dz-preview.dz-success .dz-success-mark { display: block; } .dropzone .dz-preview.dz-error .dz-error-mark { display: block; } .dropzone .dz-preview:hover { z-index: unset; } .languages.drop-down .drop-down-menu .drop-down-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .categories .category { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 10px; padding: 15px 10px; color: var(--secondaryColor); } .categories .category:not(:last-child) { border-bottom: 1px solid #eee; } .feat { 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; text-align: center; } .feat .feat-icon { width: 80px; height: 80px; margin-bottom: 16px; } .feat .feat-icon img { width: 100%; height: 100%; border-radius: 5px; } .feat .feat-info .feat-title { font-size: 18px; margin-bottom: 6px; font-weight: 500; } .feat .feat-info .feat-text { font-weight: 300; color: #888; } .transfer-textarea { height: 45px; } .tags-input-wrapper { background: transparent; padding: 10px; border-radius: 4px; max-width: 400px; border: 1px solid #ccc } .tags-input-wrapper input { border: none; background: transparent; outline: none; width: 150px; } .tags-input-wrapper .tag { display: inline-block; background-color: #fa0e7e; color: white; font-size: 14px; border-radius: 40px; padding: 0px 3px 0px 7px; margin-right: 5px; margin-bottom: 7px; box-shadow: 0 5px 15px -2px rgba(250, 14, 126, .7) } .tags-input-wrapper .tag a { margin: 0 7px 3px; display: inline-block; cursor: pointer; } .tags-input-wrapper { position: relative; max-width: 100%; border-radius: .25rem; padding: .563rem 1.9rem .563rem .75rem !important; -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out; transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out; -o-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out; min-height: 44px; } .tags-input-wrapper.active { border-color: var(--primaryColor); } .tags-input-wrapper .tag { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 1px solid var(--primaryColor); border-radius: 6px; color: var(--primaryColor); background-color: #fff; -webkit-box-shadow: none; box-shadow: none; padding: 5px; font-size: 13px; line-height: 1; margin-top: 3px; margin-bottom: 3px; } .tags-input-wrapper .tag a { margin: 0 0 0 5px; font-size: 14px; } .tags-input-wrapper .tag a:hover { color: #ff5656; } .tags-input-wrapper .icon { position: absolute; top: 10px; right: .75rem; cursor: pointer; color: #c4c4c4; } .tags-input-wrapper .icon:hover { color: var(--primaryColor); } .file-container { max-width: 480px; margin-right: auto; margin-left: auto; } .upload-complete { text-align: center; } .upload-complete .upload-complete-icon { margin-bottom: 16px; color: var(--secondaryColor); } .upload-complete .upload-complete-icon i { font-size: 80px; } .upload-complete .upload-complete-title { font-size: 25px; margin-bottom: 5px; } @media (max-width: 767.98px) { .upload-complete .upload-complete-title { font-size: 19px; } } .upload-complete .upload-complete-text { color: #888; } .files { text-align: start; background-color: #eee; border-radius: 5px; max-height: 262px; } .files .vi.vi-file::before { border-top-color: #eee; border-right-color: #eee; } .files .file { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 5px 13px; } .files .file:not(:last-child) { border-bottom: 1px solid #fff; } .files .file .file-icon { width: 28px; margin-top: 8px; margin-right: 10px; } .files .file .file-info { width: calc(100% - 60px); margin-right: 10px; } .files .file .file-info .file-title { -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .files .file .file-info .file-text { font-size: 12px; color: #888; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .page-item.disabled .page-link { background: transparent; } .vr-adv-unit.vr-adv-unit-728x90 { width: 100%; min-width: 728px; max-width: 728px; height: auto; } .vr-adv-unit.vr-adv-unit-300x280 { width: 100%; min-width: 300px; max-width: 300px; height: 280px; } @media (max-width: 575.98px) { .vr-adv-unit.vr-adv-unit-728x90 { width: 100%; min-width: 300px; max-width: 300px; max-height: 280px; } } .swal2-styled:focus { box-shadow: none !important; } .animation-zoomIn { -webkit-animation: zoomIn .5s; animation: zoomIn .5s; } @-webkit-keyframes zoomIn { 0% { -webkit-transform: perspective(200px) translateZ(-50px); transform: perspective(200px) translateZ(-50px); } 100% { -webkit-transform: perspective(200px) translateZ(0); transform: perspective(200px) translateZ(0); } } @keyframes zoomIn { 0% { -webkit-transform: perspective(200px) translateZ(-50px); transform: perspective(200px) translateZ(-50px); } 100% { -webkit-transform: perspective(200px) translateZ(0); transform: perspective(200px) translateZ(0); } } @-webkit-keyframes bounce { 0%, 10%, 20%, 30%, 40%, 60%, 80%, 90%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 50%, 70% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @keyframes bounce { 0%, 10%, 20%, 30%, 40%, 60%, 80%, 90%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 50%, 70% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } /** Custom Css **/ .page-slider .swiper-bg::after { display:none; } /* .header .nav-bar .logo img:first-child { display: none; } */ /* .header .nav-bar .logo img:last-child { display: block !important; } */ .header .nav-bar .drop-down .drop-down-btn, .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { color: #ffffff; font-family: 'Manrope', sans-serif; font-weight:400; font-size:16px; } a.nav-bar-link.btn.btn-outline-light.btn-sm.me-3 { background: #18B5B8; border-color: #18B5B8; color: #fff; } a.nav-bar-link.btn.btn-light.btn-sm { background: transparent; color: #ffffff !important; border: 1px solid #ffffff !important; } .nav-bar-menu a.nav-bar-link.btn.btn-outline-light.btn-sm.me-3:hover, .nav-bar-menu a.nav-bar-link.btn.btn-light.btn-sm:hover{ color:#fff !important; background: #18B5B8; border: 1px solid #18B5B8 !important; } .btn { /*padding: 2px 25px !important;*/ border-radius:100px; font-family: 'Manrope', sans-serif; font-size:14px; } .dropzone-wrapper p.h2.mb-3.aos-init.aos-animate{ font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 35px; color: #00aeb2; } .dropzone-wrapper p.lead.mb-0 { font-family: 'Manrope', sans-serif; font-weight:400; font-size:16px; } .loader-bg{position:fixed;z-index:999999;background:#fff;width:100%;height:100%}.loader{border:0 solid transparent;border-radius:50%;width:150px;height:150px;position:absolute;top:calc(50vh - 75px);left:calc(50vw - 75px)}.loader:after,.loader:before{content:'';border:1em solid #18B5B8;border-radius:50%;width:inherit;height:inherit;position:absolute;top:0;left:0;animation:loader 2s linear infinite;opacity:0}.loader:before{animation-delay:.5s}@keyframes loader{0%{transform:scale(0);opacity:0}50%{opacity:1}100%{transform:scale(1);opacity:0}} body.home{ overflow:hidden; } .page-slider { background-color: #131517; background-image:url(https://transfya.com/assets/img/spacebackground.webp); background-position:center; background-size:auto; background-repeat:no-repeat; } .header .nav-bar .nav-bar-menu-icon { cursor: pointer; color: #00aeb2; font-size: 24px; } .home button.btn.btn-secondary.btn-md.dz-clickable { padding: 10px 25px !important; position: absolute; z-index: 999; top: 12px; width: 170px !important; } .button-an-wrap { position: relative; height: 64px; width: 210px; position: relative; cursor: pointer; padding: 21px; margin: 0 auto; } .sp-wave{ border-radius: 100px; width: 100%; height: 100%; border: 2rem #ff554a solid; position: absolute; left: 0px; z-index: 1; } .sp-wave.before { opacity: 0; -webkit-animation: spWaveBe 2s infinite linear 0.5s; animation: spWaveBe 2s infinite linear 0.5s; } .sp-wave.after{ opacity: 0; -webkit-animation: spWaveAf 2s infinite linear 0.5s; animation: spWaveAf 2s infinite linear 0.5s; } @-webkit-keyframes spWaveAf { 0% { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 0.2; } } @keyframes spWaveAf { 0% { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 0.2; } } @-webkit-keyframes spWaveBe { 0% { transform: scale(1); opacity: 0.2; } to { transform: scale(1.2); opacity: 0; } } @keyframes spWaveBe { 0% { transform: scale(1); opacity: 0.2; } to { transform: scale(1.2); opacity: 0; } } .sp-wave.before, .sp-wave.after{ content: ""; top: 0px; -ms-transform: scale(1.2); transform: scale(1.2); } @media (min-width: 1100px){ .home .header .nav-bar .nav-bar-menu-icon{ margin-left:30px; display: block !important; } .home .nav-bar-menu { visibility: hidden; opacity: 0; transition: 0.5s; } .home .header .nav-bar .nav-bar-menu.active{ visibility: hidden; opacity: 0; } .home .header .nav-bar .nav-bar-menu.desktop-active{ visibility: visible; opacity: 1; } } @media (max-width: 1100px){ body.home{ overflow:inherit; } .header .nav-bar { height: 80px; } .header .nav-bar .logo { height: 65px; } .nav-bar-menu-icon{ display:block !important; } .header .nav-bar .nav-bar-menu .overlay { display: block; } .d-flex.justify-content-end.w-100.mb-3.d-lg-none { display: block !important; text-align: right; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link.btn.btn-outline-light { border-color: #18B5B8 !important; color: #fff !important; } .header .nav-bar .nav-bar-menu .nav-bar-links{ background-color:#131517; } .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { margin-top: 10px; margin-bottom: 10px; } } @media (max-width: 768.98px){ .header .nav-bar { height: 80px; } .header .nav-bar .logo { height: 65px; } .header-content { /*max-width: 100px;*/ text-align: center; } .right-side-banner { margin-top: 50px; display:none; } .home .header { padding-top: 0px !important; margin-top: -15px; } } /* .page .header .nav-bar .drop-down .drop-down-btn, .page .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { color: #fff; } .page a.nav-bar-link.btn.btn-light.btn-sm { background: transparent; color: #fff !important; border: 1px solid #fff !important; } .page .header .nav-bar .logo img:last-child { display: none !important; } .page .header .nav-bar .logo img:first-child { display: block !important; } .page .header .nav-bar.active .nav-bar-menu .nav-bar-links .nav-bar-link, .page .header .nav-bar.active .drop-down .drop-down-btn{ color:#000 !important; } .page .header .nav-bar.active .logo img:last-child { display: block !important; } .page .header .nav-bar.active .logo img:first-child { display: none !important; } .page .header .nav-bar.active a.nav-bar-link.btn.btn-light.btn-sm {.header.v2 color: #fff !important; } .page .header .nav-bar .nav-bar-menu-icon { color: #fff; } */ button.btn.btn-secondary.btn-md.dz-clickable { padding: 10px 25px !important; } /*.page .header.v2{*/ /* background-image: url('{{ asset('images/page-header-bg.jpg') }}');*/ /*}*/ .page .header .nav-bar.active .nav-bar-links .btn.btn-outline-light { border-color: #18B5B8!important; color: #fff!important; } .page .header.v2{ height:260px !important; } @media (max-width: 1100px){ .page .header .nav-bar .drop-down .drop-down-btn, .page .header .nav-bar .nav-bar-menu .nav-bar-links .nav-bar-link { color: #ffffff; } } .pricing .header.v2 { height: 80px !important; padding: 15px 0; } .pricing section.header-banner { background: #F3F5F7; padding:60px 0; position:relative; } .pricing section.header-banner:after { height: 360px; content: ""; position: absolute; bottom: -85px; left: 50%; background-image: url('/images/transfya-world-map.png'); width: 650px; background-size: contain; transform: translateX(-50%); background-repeat: no-repeat; z-index: 9; } .pricing .s-title h1{ color: #475E6D; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 35px; } .pricing .s-subtitle h3 { color: #475E6D; font-family: 'Poppins', sans-serif; font-weight: 400; font-size: 25px; margin-bottom: 10px; } .pricing .section-text p { color: #404040; font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 16px; margin-bottom: 15px; } .pricing .section .section-inner .section-header { margin-bottom: 15px; } .pricing .pricing-banner-image { margin-left: 100px; margin-bottom: -130px; position: relative; bottom: -15px; /* z-index: 9999999999999999999; */ } .feature-item { padding: 15px 15px 30px 30px; border-width: 0px 1px 0px 0px; border-color: #C5C5C5; border-style: solid; margin-top: 30px; } .feature-item.active{ background: #f3f5f7; border-radius: 6px; box-shadow: 0px 0px 16px -5px rgb(0 0 0 / 50%); } .feature-item-list .list-group .list-group-item { background: transparent; border: none !important; border-bottom: 1px solid #57707b !important; color: #57707b; padding: 5px 0; font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight:400; } .feature-item-list .list-group .list-group-item i { margin-right: 15px; font-size: 18px; } .feature-item-list .list-group .list-group-item:last-child{ border: none !important; } .feature-item-logo { height: 60px; } .feature-item-logo img { height: 30px; filter: brightness( 100% ) contrast( 100% ) saturate( 0% ) blur( 0px ) hue-rotate( 0deg ); } .feature-item.active .feature-item-logo img { filter:none; } .grid-feature-items-wrap { display: flex; flex-wrap: wrap; border-bottom: 1px solid #57707b; border-left: 1px solid #57707b; } .grid-feature-item{ width:25%; } .grid-fi-inner { border-style: solid; border-width: 1px 1px 0px 0px; border-color: #57707b; transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s; padding: 20px 20px 20px 20px; display: flex; height:83px; } .grid-fi-icon { margin-right:10px; } .grid-fi-icon i { font-size: 24px; color:#57707b; } .grid-fi-title{ font-family: "Poppins", Sans-serif; font-size: 14px; font-weight: 500; text-transform: none; font-style: normal; text-decoration: none; color:#57707b; } .grid-fi-text{ font-family: "Open Sans", Sans-serif; font-size: 14px; font-weight: 400; text-transform: none; font-style: normal; text-decoration: none; } .section-title{} .section-title:after{ display:none; } .section-title h3{ color:#57707b; font-family: "Poppins", Sans-serif; font-size: 25px; font-weight: 500; text-transform: none; font-style: normal; text-decoration: none; } @media (max-width: 1399.98px){ .grid-fi-inner { height:100px; } .pricing .pricing-banner-image { margin-left: 50px; margin-bottom: -130px; position: relative; bottom: -30px; /* z-index: 9999999999999999999; */ } } @media (max-width: 1199.98px){ .grid-fi-inner { height:115px; } .pricing .pricing-banner-image { margin-left: 0; margin-bottom: -130px; position: relative; bottom: -70px; /* z-index: 9999999999999999999; */ } } @media (max-width: 991.98px){ .grid-feature-item {.header-content width: 50%; } .grid-fi-inner { height:auto; } .pricing section.header-banner:after{ width:100%; } } @media (max-width: 768px){ .button-an-wrap { margin: 0 auto; } div#dropzone-wrapper { margin-top: 120px; } .sp-wave { left: 50%; margin-left: -105px; } .home button.btn.btn-secondary.btn-md.dz-clickable { margin-left: -85px; } .grid-feature-item { width: 100%; } .grid-fi-inner { height:auto; } .pricing .pricing-banner-image { margin-left: 0; margin-bottom: 0; position: relative; bottom: 0; } } .plan .plan-text{ display:none; } canvas.particles-js-canvas-el { position: absolute; } .ts-social-wrap { position: fixed; top: 50%; transform: translateY(-50%); left: 5px; z-index: 99; } ul.ts-social { margin: 0; padding: 0; } .ts-social-horizontal-wrap ul.ts-social { margin: 0; padding: 0; display: flex; list-style-type: none; } ul.ts-social li a { background: var(--secondaryColor); color: #fff; border-radius: 100px; padding: 0px; display: block; width: 28px; height: 28px; text-align: center; margin: 8px; align-items: center; line-height: 28px; } .ts-nav-outline-wrapper .ts-nav-wrap{ position: fixed; top: 0; bottom: 0; max-width: 400px; background-image: url('https://transfya.com/assets/img/spacebackground.webp'); background-size: cover; background-position: center center; z-index: 999; transition: left .3s ease-in-out,right .3s ease-in-out; box-shadow: 0 0 18px rgba(0,0,0,.1); right: -120%; padding: 40px; } .ts-nav-outline-wrapper.ts-active .ts-nav-wrap{ right: 0; } .ts-nav-outline-wrapper.ts-active .ts-nav-overlay { position: fixed; background: rgba(0,0,0,0.8); left: 0; top: 0; display: block; z-index: 999; width: 100%; height: 100%; } .ts-close-menu { color: #fff !important; font-size: 36px !important; position: absolute; right: 25px; top: 10px; cursor: pointer !important; z-index: 9999; } .ts-nav-outline-wrapper.ts-active .ts-menu-text{ color: #fff; } .ts-nav-outline-wrapper.ts-active .ts-nav-menus { margin: 30px 0px; } .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul{ margin: 0; padding: 0; } .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li{ margin: 5px 0px; animation: slidein 0.5s ease 1 both; } .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(2) {animation-delay: 0.25s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(3) {animation-delay: 0.30s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(4) {animation-delay: 0.35s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(5) {animation-delay: 0.40s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(6) {animation-delay: 0.45s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(7) {animation-delay: 0.50s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li:nth-child(8) {animation-delay: 0.55s} .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li a { font-size: 16px; color: #fff; line-height: 30px; } .ts-nav-outline-wrapper.ts-active .ts-nav-menus ul li a:hover { padding-left: 10px; color: var(--secondaryColor); } .ts-nav-outline-wrapper.ts-active ul.ts-social li:first-child a{ margin-left: 0px !important; } .ts-nav-menu-icon{ color: #fff !important; margin-left: 15px; cursor: pointer; } .ts-nav-menu-icon img { width: 28px; } .header .nav-bar .logo { display: flex; align-items: center; } @keyframes slidein{ from{ transform: translateX(10rem); /* Change from -10rem to 10rem */ opacity: 0; } to{ transform: translate(0); opacity: 1; } } @media only screen and (max-width: 768px) { .header .nav-bar .logo img { object-fit: contain; width: 230px; } .ts-social-wrap { top:inherit; bottom: 0px; display: none; } .dropzone-wrapper p.h2.mb-3 { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 35px; color: #00aeb2; } } /* Redesign Transfer */ .dropzone-wrapper .dropzone-uploadbox{ background: rgba(0,0,0,0.5) !important; border:1px solid #00aeb2; } .dropzone-wrapper .dropzone-uploadbox .dropzone-more .dropzone-more-title { font-size: 20px; color: #fff; } .dropzone-wrapper .dropzone-uploadbox .dropzone-reset { color: #fff; } .dropzone .dz-preview.dz-image-preview { background: transparent !important; } .dropzone .dz-preview .dz-fileicon .vi.vi-file::before { display: none; } .dropzone .dz-preview .dz-fileicon .vi.vi-file { background: -o-radial-gradient(top left, circle, #00aeb2, #00aeb2); background: radial-gradient(circle at top left, #00aeb2, #00aeb2); } .dropzone .dz-preview .dz-details .dz-filename { color: #fff !important; } .dropzone .dz-preview .dz-details .dz-filename span { font-weight: bold; } .dropzone .dz-preview .dz-details .dz-size{ color: #00aeb2 !important; } .dropzone .dz-preview .dz-details .dz-remove { background: var(--secondaryColor); right: 0 !important; } /* .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files{ overflow-y: scroll; height: 140px !important; } */ .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-uploadbox-header, .dropzone-wrapper .dropzone-uploadbox.show-forms .dropzone-uploadbox-files { display: flex !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-forms .dropzone-form{ background: transparent !important; } .tags-input-wrapper, .dropzone-form input, .dropzone-form textarea { background: transparent !important; border-radius: 0 !important; border: 0; border-bottom: 1px solid #00aeb2 !important; color: #fff !important; } .tags-input-wrapper input{ border:0 !important; } .dropzone-form .transfer-textarea { height: 88px !important; max-height: 88px !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-lower .dropzone-form-actions { display: none !important; } .dropzone .dz-preview { padding: 0px !important; } .dropzone .vi.vi-file { width: 36px; height: 24px; border-radius: 0; } .dropzone .vi.vi-file::after { font-size: 13px; } .dropzone .dz-preview{ height: 40px !important; background: transparent !important; } .dropzone-circle-progress { text-align: center; } .circle { width: 120px; margin: 6px 6px 20px; display: inline-block; position: relative; text-align: center; line-height: 1.2; } .circle canvas { vertical-align: top; } .circle strong { position: absolute; top: 30px; left: 0; width: 100%; text-align: center; line-height: 40px; font-size: 30px; color: #fff; } .circle strong i { font-style: normal; font-size: 0.6em; font-weight: normal; } .circle span { display: block; color: #fff; margin-top: 12px; position: absolute; top: 55px; text-align: center; left: 45px; font-size: 14px; font-weight: bold; } .dropzone-wrapper .dropzone-uploadbox .dropzone-more .dropzone-more-text { color: #fff; font-size: 14px; position: absolute; top: 0; right: 0; background: #00aeb2; padding: 10px; border-bottom-left-radius: 6px; border-top-right-radius: 6px; } .dropzone-more-text span:nth-of-type(even){ font-weight: bold !important; } .ts-max-size { position: absolute; margin-left: 1px; padding: 10px 3px; color: #fff; font-weight: 400; top: -60px; left: 0; width: 100%; text-align: center; } .dropzone-wrapper .dropzone-uploadbox { overflow: inherit; } .dropzone-wrapper .btn.btn-md{ width: 100% !important; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner, .file-container .card-v{ background: rgba(0,0,0,0.5) !important; } .upload-complete .upload-complete-title { color: #fff; } .dropzone-wrapper .dz-percent{ color: #00aeb2; } .dropzone .dz-preview .dz-progress .dz-upload { background: #00aeb2; border-radius: 0 !important; } .upload-complete .upload-complete-icon { color: #00aeb2; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-icon i{ color: #fff !important; } .dropzone-wrapper .dropzone-drag .dropzone-drag-inner .dropzone-drag-title{ color: #00aeb2; } .file-container .card-v { border: 1px solid #00aeb2; } .form-button button.btn-copy{ color: #00aeb2; } form#transferByEmailForm { margin-top: 15px; } @media only screen and (min-width: 768px) { .dropzone-circle-progress { text-align: center; position: fixed; top: 100px; right: 50px; } } @media only screen and (max-width: 768px) { .ts-max-size{ display: none; } } /* ===== Scrollbar CSS ===== */ .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files{ max-height: 140px !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files .simplebar-offset{ overflow-y: scroll !important; height: 140px !important; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files .simplebar-offset::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 0px; background-color: #F5F5F5; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files .simplebar-offset::-webkit-scrollbar { width: 10px; background-color: #F5F5F5; } .dropzone-wrapper .dropzone-uploadbox .dropzone-uploadbox-upper .dropzone-uploadbox-files .simplebar-offset::-webkit-scrollbar-thumb { border-radius: 0px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #00aeb2 !important; } /* .dropzone-wrapper .dropzone-uploadbox{ display: block !important; } */ .ts-line-progress { max-width: 50%; padding-left: 20px; padding-top: 5px; } .ts-line-percentage { color: #fff; font-weight: bold; font-size: 24px; margin-right: 15px; } .ts-line-percentage i{ font-weight: normal; font-size:14px; } .ts-line-progress-inner { display: flex; align-items: center; width: 100%; } .ts-line-progress .progress { border-radius: 0 !important; height: 6px !important; width: 100%; } .ts-line-progress .progress-bar{ background: #00aeb2 !important; border-radius: 0 !important; height: 6px !important; } .ts-right-privacy { position: fixed; right: 15px; top: 50%; transform: translateY(-50%); z-index: 99; } ul.ts-privacy-link { display: flex; writing-mode: vertical-rl; transform: rotate(180deg); margin: 0; padding: 0; } ul.ts-privacy-link li { padding: 0px; list-style-type: disc; color: #ff554a; margin: 15px 0px; } ul.ts-privacy-link li a{ color: #fff !important; font-weight: 500; } .ts-max-size button { border: 0; outline: 0; border-radius: 100px; padding: 5px 15px; margin-left: 5px; margin-right: 5px; font-weight: 500; } .ts-max-size a{ color: #00aeb2; } .ts-footer-copyright { position: fixed; bottom: 50px; width: 100%; color: #fff; } .ts-footer-copyright-text{ font-weight: bold; } .ts-footer-copyright-text a{ color: #00aeb2; } .ts-uploadbox-footer-text { color: #fff; text-align: center; position: absolute; bottom: -40px; width: 100%; } .ts-uploadbox-footer-text p{ text-align: center; }