@charset "UTF-8"; @font-face { font-family: 'Exo 2'; font-weight: 600; font-display: swap; src: url('../fonts/exo-2-v8-latin-600italic.eot'); src: local(''), url('../fonts/exo-2-v8-latin-600italic.eot?#iefix') format('embedded-opentype'), url('../fonts/exo-2-v8-latin-600italic.otf') format('opentype'), url('../fonts/exo-2-v8-latin-600italic.woff2') format('woff2'), url('../fonts/exo-2-v8-latin-600italic.woff') format('woff'), url('../fonts/exo-2-v8-latin-600italic.ttf') format('truetype'), url('../fonts/exo-2-v8-latin-600italic.svg#Exo2') format('svg'); } @font-face { font-family: 'Exo 2'; font-weight: 800; font-display: swap; src: url('../fonts/exo-2-v8-latin-800italic.eot'); src: local(''), url('../fonts/exo-2-v8-latin-800italic.eot?#iefix') format('embedded-opentype'), url('../fonts/exo-2-v8-latin-800italic.otf') format('opentype'), url('../fonts/exo-2-v8-latin-800italic.woff2') format('woff2'), url('../fonts/exo-2-v8-latin-800italic.woff') format('woff'), url('../fonts/exo-2-v8-latin-800italic.ttf') format('truetype'), url('../fonts/exo-2-v8-latin-800italic.svg#Exo2') format('svg'); } @font-face { font-family: 'Courier Prime'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/courier-prime-v1-latin-regular.eot'); src: local('Courier Prime Regular'), local('CourierPrime-Regular'), url('../fonts/courier-prime-v1-latin-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/courier-prime-v1-latin-regular.woff2') format('woff2'), url('../fonts/courier-prime-v1-latin-regular.woff') format('woff'), url('../fonts/courier-prime-v1-latin-regular.ttf') format('truetype'), url('../fonts/courier-prime-v1-latin-regular.svg#CourierPrime') format('svg'); } :root{ --libmo: #009688; --libmo2: #fd7737; --gray-light: #ced4da; --gray-light: rgba(0,0,0,.125); } .form-control::-webkit-input-placeholder, ::-webkit-input-placeholder{ color: #ced4da; } .form-control:-ms-input-placeholder, :-ms-input-placeholder{ color: #ced4da; } .form-control::placeholder, ::placeholder{ color: #ced4da; } body { font-family: Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; position: relative; overflow-y: scroll!important; padding: 0!important; background: #fdfeff; background: #fcfdfb; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body[data-page="account"][data-loggedin="1"] #dashboard{ padding-top: 100px; } button, input, optgroup, select, textarea{ font-family: Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif } *:focus { outline:0; } a { color: #009688; } a:hover{ color: #10A598; text-decoration: none; } a.text-primary:hover{ color: #10A598 !important; } a:focus{ color: #15A999; } a.text-primary:focus{ color: #15A999 !important; } .text-monospace{ font-family: 'Courier Prime', SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important; } .xfont{ font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; } h1, h2, h3, h4, h5, h6{ font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; } h1 { font-size: 60px; font-weight: 300; letter-spacing: -1px; margin-bottom: 1.5rem; } h2 { font-size: 45px; font-weight: 300; color: #009688; letter-spacing: -1px; margin-bottom: 1rem; } h3 { color: #009688; font-size: 33px; font-weight: 500; } .lib-list h3{ font-size: 38px; } h4 { font-size: 23px; font-weight: 500; color: #009688; margin-top: 30px; margin-bottom: 15px; } h4.card-title{ margin-top: 0; } .lib-list h4{ font-size: 28px; } h5 { font-size: 19px; font-weight: 500; } p { color: #959094; } p.lead { color: #009688; margin-bottom: 2rem; font-weight: normal; } .text-primary { color: var(--libmo) !important; } .light-font { font-weight: 300; } .request_codes{ margin-right: .75rem; width: 144px; } .worker_list{ width: 168px; } .accesscontrol_box{ width: 166px; display: inline-block; text-align: left; padding: 3px; border-radius: .4rem } .accesscontrol_label{ font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; text-align: left; padding: 0px 0 2px 6px; font-size: 13px; } .accesscontrol_label .ti-info{ background: #e9ecef; border-radius: 50%; font-size: 11px; padding: 1px; margin: 2px 3px; } input.accesscontrol{ text-align: center; font-size: 1.2rem; width: 160px; padding-bottom: .1rem; display: inline-block; } .btn { border-radius: 12px; font-size: 12px; font-weight: 400; text-transform: uppercase; padding: 0.4rem 1.35rem 0.35rem 1.35rem; transition: all 0.3s ease; cursor: pointer; } .btn-outline-light:hover { color: #049588; } .btn-secondary[data-target="#addLibModal"]{ border-radius: 12px; box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.2); font-weight: 500; padding: 0.6rem 1.3rem; border: 0; } .btn-secondary[data-target="#addLibModal"] .icon{ font-size: 18px; line-height: 15px; margin-right: 12px; vertical-align: sub; } .btn-secondary { border-radius: 12px; font-weight: 500; padding: 0.6rem 2rem; border: 0; } .btn-primary { border-radius: 12px; background-image: -moz-linear-gradient( 122deg, #e58f45 0%, #fd7737 100%); background-image: -webkit-linear-gradient( 122deg, #e58f45 0%, #fd7737 100%); background-image: -ms-linear-gradient( 122deg, #e58f45 0%, #fd7737 100%); background-image: linear-gradient( 122deg, #e58f45 0%, #fd7737 100%); box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.2); font-weight: 500; padding: 0.6rem 2rem; border: 0; } .btn-primary .icon{ font-size: 18px; line-height: 15px; margin-right: 12px; vertical-align: sub; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:not([disabled]):not(.disabled).active, .btn-primary:not([disabled]):not(.disabled):active, .show>.btn-primary.dropdown-toggle { background-image: linear-gradient( 122deg, #fd7737 0%, #e58f45 100%); box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.3); color: #FFF; } .btn-light { border-radius: 12px; background: #FFF; box-shadow: 0px 5px 19px 0px rgba(0, 0, 0, 0.26); font-size: 14px; font-weight: 500; color: #009688; margin: 0.5rem; padding: 0.7rem 1.6rem; line-height: 1.8; } .btn-group-lg>.btn, .btn-lg { padding: 0.8rem 1rem; font-size: 15px; } .btn-light:hover{ background-color: #fdf7fa; border-color: #fdeff6; } .light-bg { background-color: #fbfaf9; background-color: #f8f9fa; } .btn-icon{ vertical-align: middle; margin-right: .25rem; margin-bottom: 4px; display: inline-block; } .ti.bullet{ color: var(--libmo); font-size: 26px; margin: 0 11px 0 2px; vertical-align: middle; float: left; } p.important, p.important .ti.bullet{ color: var(--libmo2); } p.lt{ border-top: 1px solid #e2e4e3; padding-top: 16px; } p.lb{ border-bottom: 1px solid #e2e4e3; padding-bottom: 16px; } .section { padding: 80px 0; } .section.logged-in, .section.logged-out{ display: none; } body[data-loggedin="1"] .section.logged-in{ display: block; }.section.logged-in{ display: none; } body[data-loggedin="0"] .section.logged-out{ display: block; } .section#pricing{ background: -moz-linear-gradient(top, rgba(231,241,236,0) 0%, rgba(231,241,236,0) 1%, rgba(231,241,236,0.25) 46%, rgba(231,241,236,0.75) 100%); background: -webkit-linear-gradient(top, rgba(231,241,236,0) 0%,rgba(231,241,236,0) 1%,rgba(231,241,236,0.25) 46%,rgba(231,241,236,0.75) 100%); background: linear-gradient(to bottom, rgba(231,241,236,0) 0%,rgba(231,241,236,0) 1%,rgba(231,241,236,0.25) 46%,rgba(231,241,236,0.75) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f9e5ee', endColorstr='#f9e5ee',GradientType=0 ); } .section-title { text-align: center; margin-bottom: 3rem; } .section-title small { color: #998a9b; } @media (max-width:767px) { h1 { font-size: 40px; } h2 { font-size: 30px; } } @-webkit-keyframes fadeIn{ from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn{ from { opacity: 0; } to { opacity: 1; } } .modal-body{ padding-top: 14px; padding-bottom: 4px; } .flying{ position: fixed; right: 0; bottom: -50px; border-top-right-radius: 0; border-bottom-right-radius: 0; z-index: 100; font-size: 14px; line-height: 18px; width: 80px; padding: 6px; opacity: 0; transition: opacity 1.2s ease-in-out, bottom 0.8s ease-in-out; } .flying.on{ opacity: 1; bottom: 30px; } @media (max-width:480px) { .flying{ width: 75px; font-size: 13px; line-height: 17px; padding: 5px; padding-left: 2px; } .flying.on{ bottom: 14px; } } .nav-menu { padding: 1rem 0; transition: all 0.3s ease; padding-right: 0!important; } .nav-menu.is-scrolling, .nav-menu.menu-is-open { background-color: rgb(4, 149, 136); background: -moz-linear-gradient(135deg, rgb(4, 149, 136) 0%, rgb(3, 180, 163) 100%); background: -webkit-linear-gradient(135deg, rgb(4, 149, 136) 0%, rgb(3, 180, 163) 100%); background: linear-gradient(135deg, rgb(4, 149, 136) 0%, rgb(3, 180, 163) 100%); -webkit-box-shadow: 0px 5px 23px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 5px 23px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 5px 23px 0px rgba(0, 0, 0, 0.1); } .nav-menu.is-scrolling { padding: 0; } .navbar-nav .nav-link { position: relative; } @media (min-width: 992px) { .navbar-expand-lg .navbar-nav .nav-link { padding-right: 1rem; padding-left: 1rem; font-size: 14px; } .navbar-nav>.nav-item>.nav-link.active:after { content: ""; border-bottom: 2px solid #05796e; left: 1rem; right: 1rem; bottom: 5px; height: 1px; position: absolute; } } @media (max-width:991px) { .navbar-nav.is-scrolling { padding-bottom: 1rem; } .navbar-nav .nav-item { text-align: center; } } .nav-item.logged-in, .nav-item.logged-out{ display: none; } body[data-loggedin="1"] .nav-item.logged-in{ display: list-item; } body:not([data-loggedin="1"]) .nav-item.logged-out{ display: list-item; opacity: 0; -webkit-animation-name: fadeIn; -webkit-animation-duration: 1.5s; -webkit-animation-delay: 0.5s; -webkit-animation-fill-mode: forwards; animation-name: fadeIn; animation-duration: 1.5s; animation-delay: 0.5s; animation-fill-mode: forwards; } header { padding: 100px 0 0; text-align: center; color: #FFF; } @media (max-width:480px) { header{ padding-top: 80px; } } .bg-gradient { background-image: -moz-linear-gradient( 135deg, rgba(4, 149, 136, 0.96) 0%, rgba(3, 180, 163, 0.8) 100%); background-image: -webkit-linear-gradient( 135deg, rgba(4, 149, 136, 0.96) 0%, rgba(3, 180, 163, 0.8) 100%); background-image: -ms-linear-gradient( 135deg, rgba(4, 149, 136, 0.96) 0%, rgba(3, 180, 163, 0.8) 100%); background-image: linear-gradient( 135deg, rgba(4, 149, 136, 0.96) 0%, rgba(3, 180, 163, 0.8) 100%); } .slogan{ max-width: 640px; margin-left: auto; margin-right: auto; } .tagline { font-size: 23px; color: #05695f; max-width: 420px; margin: 31px auto; } .tagline.boxed{ background: rgba(255,255,255,0.13); padding: 20px 35px; border-radius: 120px; } .tagline .z1{ font-size: 34px; line-height: 24px; margin-right: 3px; } .tagline .z2{ font-size: 34px; line-height: 24px; vertical-align: sub; margin-left: 1px; } .img-holder { height: 0; padding-bottom: 23%; overflow: hidden; } @media (max-width:1600px) { .img-holder { padding-bottom: 33%; } } @media (max-width:1200px) { .img-holder { padding-bottom: 40%; } } @media (max-width:980px) { .img-holder { padding-bottom: 50%; } } @media (max-width:767px) { .img-holder { padding-bottom: 60%; } } @media (max-width:480px) { .tagline { font-size: 18px; max-width: 330px; } .tagline .z1, .tagline .z2{ font-size: 24px; } .img-holder { padding-bottom: 80%; } } .gradient-fill:before { color: #009688; background: -moz-linear-gradient(top, #05796e 0%, #009688 100%); background: -webkit-linear-gradient(top, #05796e 0%, #009688 100%); background: linear-gradient(to bottom, #05796e 0%, #009688 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .card.features { border: 0; border-radius: 3px; box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.04); transition: all 0.3s ease; } @media (max-width:991px) { .card.features { margin-bottom: 2rem; } [class^="col-"]:last-child .card.features { margin-bottom: 0; } } .card.features:before { content: ""; position: absolute; width: 3px; color: #009688; background: -moz-linear-gradient(top, #05796e 0%, #009688 100%); background: -webkit-linear-gradient(top, #05796e 0%, #009688 100%); background: linear-gradient(to bottom, #05796e 0%, #009688 100%); top: 0; bottom: 0; left: 0; } .card-text { font-size: 14px; } .card.features:hover { transform: translateY(-3px); -moz-box-shadow: 0px 5px 30px 0px rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0px 5px 30px 0px rgba(0, 0, 0, 0.08); box-shadow: 0px 5px 30px 0px rgba(0, 0, 0, 0.08); } .box-icon { box-shadow: 0px 0px 43px 0px rgba(0, 0, 0, 0.14); padding: 14px; width: 80px; border-radius: 40px; margin-bottom: 1.5rem; background-color: #FFF; } .media-body h5{ margin-top: 5px; } .circle-icon { box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.07); padding: 10px; width: 60px; height: 60px; border-radius: 50%; margin-bottom: 1.5rem; background-color: #FFF; color: #fd7737; font-size: 34px; text-align: center; line-height: 38px; font-weight: 300; transition: all 1s ease; } @media (max-width:992px) { .circle-icon { width: 70px; height: 70px; font-size: 28px; line-height: 50px; } } .ui-steps li { padding: 15px 0; } .ui-steps li:not(:last-child) { border-bottom: 1px solid #f8e3f0; } .perspective-phone { position: relative; z-index: -1; } @media (min-width:992px) { .perspective-phone { margin-top: -150px; } } .tab-content { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; background-color: #FFF; box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.04); padding: 3rem; } @media (max-width:992px) { .tab-content { padding: 1.5rem; } } .tab-content p { line-height: 1.8; } .tab-content h2 { margin-bottom: 0.5rem; } .nav-tabs { border-bottom: 0; } .nav-tabs .nav-item .nav-link, .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { padding: 1rem 1rem; border-color: #fbf9fa #fbf9fa #FFF; font-size: 19px; color: #85b5b0; background: #f3f6f1; } .nav-tabs .nav-link.active { background: #FFF; border-top-width: 3px; border-color: #009688 #fbfaf9 #FFF; color: #009688; } .owl-carousel .owl-item img.client-img { width: 110px; margin: 30px auto; border-radius: 50%; box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.07); } .testimonials-single { text-align: center; max-width: 80%; margin: 0 auto; } .blockquote { color: #7a767a; font-weight: 300; max-width: 390px; margin-left: auto; margin-right: auto; } .owl-next.disabled, .owl-prev.disabled { opacity: 0.5; } .owl-prev, .owl-next { position: absolute; top: 50%; transform: translateY(-50%); } .owl-prev { left: 0; } .owl-next { right: 0; } .owl-theme .owl-nav.disabled+.owl-dots { margin-top: 60px; } .owl-theme .owl-dots .owl-dot span { background: #e7d9eb; width: 35px; height: 8px; border-radius: 10px; transition: all 0.3s ease-in; } .owl-theme .owl-dots .owl-dot:hover span { background: #ff487e; } .owl-theme .owl-dots .owl-dot.active span { background: #ff487e; box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.07); } .img-gallery .owl-item { box-shadow: 0px 9px 32px 0px rgba(0, 0, 0, 0.07); transform: scale(0.8); transition: all 0.3s ease-in; } .img-gallery .owl-item.center { transform: scale(1); } #pricing .price{ font-size: 40px; line-height: 40px; color: var(--libmo); } #pricing .price span { margin-left: 3px; font-size: 74%; } #pricing .item{ font-size: 19px; line-height: 57px; color: #05796e; } @media (max-width:480px) { #pricing .price{ font-size: 36px; line-height: 36px; } #pricing .item{ font-size: 16px; line-height: 51px; } } #startLibAboModal .price{ font-size: 33px; line-height: 33px; color: var(--libmo); } #startLibAboModal .price span { margin-left: 3px; font-size: 74%; } #startLibAboModal .item{ font-size: 16px; line-height: 50px; color: #05796e; } @media (max-width:480px) { #startLibAboModal .price{ font-size: 28px; line-height: 28px; } #startLibAboModal .item{ font-size: 14px; line-height: 40px; } } .call-to-action { text-align: center; color: #FFF; margin: 3rem 0; } .call-to-action .box-icon { margin-left: auto; margin-right: auto; border-radius: 15px; transform: scale(0.85); margin-bottom: 2.5rem; } .call-to-action h2 { color: #FFF; } .call-to-action .tagline { font-size: 16px; color: #05796e; max-width: 650px; margin: 0 auto; } .btn-light img { margin-right: 0.4rem; vertical-align: text-bottom; } footer{ opacity: 0; -webkit-animation-name: fadeIn; -webkit-animation-duration: 1.5s; -webkit-animation-delay: 0.5s; -webkit-animation-fill-mode: forwards; animation-name: fadeIn; animation-duration: 1.5s; animation-delay: 0.5s; animation-fill-mode: forwards; } .social-icons { text-align: right; } .social-icons a { background-color: #FFF; box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.05); width: 50px; height: 50px; display: inline-block; text-align: center; line-height: 50px; margin: 0 0.3rem; border-radius: 5px; color: #a9d9fe; transition: all 0.3s ease; } .social-icons a:hover { text-decoration: none; color: #009688; } @media (max-width:991px) { .social-icons { text-align: center; margin-top: 2rem; } } .modal-footer{ border: none; padding: .7rem .75rem 1rem 0; } .signup-form, .login-form, .reset-form{ position: relative; display: -ms-flexbox; display: flex; padding: 1.2rem 1.1rem 1rem 1.1rem; -ms-flex-direction: column; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0,0,0,.2); border-radius: 0.6rem; outline: 0; min-width: 300px; max-width: 500px; color: #959094; text-align: left; } .signup-form h3, .login-form h3, .reset-form h3{ margin-bottom: 0; } .seperator{ width: 50%; max-width: 110px; height: 3px; background: var(--gray-light); margin: 13px auto 17px auto; } .signup-form button, .login-form button, .reset-form button{ width: 230px; margin: 30px auto 25px auto; } form .error{ color: #f13e91; } form label.error{ font-size: 14px; margin: 1px 0 0 2px; } .toasthint_box{ position: fixed; bottom: 25px; right: 25px; min-height: 85px; z-index: 100000; } @media (max-width: 767px){ .toasthint_box{ top: 0; bottom: auto; right: auto; width: 100%; text-align: center; margin: auto; padding: 10px 0 30px 0; background: -moz-linear-gradient(top, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0.2) 50%,rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.2) 50%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); } .toasthint_box .toast{ margin: auto; } } .toast-header{ color: #fff; background-color: var(--libmo); } .toast-header button.close{ color: #fff; text-shadow: none; } .lib-list .btn-icon{ font-size: 16px; } .lib-cats{ min-width: 300px; max-width: 100%; } @media (max-width: 767px){ .lib-cats{ min-width: 100%; } } .lib-workers{ width: 100%; } .worker-row{ padding-right: 0.5rem; border-left: none; border-right: none; } .worker-row:first-child{ border-top: none; } .worker-row:last-child{ border-bottom: none; } .worker-name span{ white-space: nowrap; } @media (max-width: 480px){ .worker-name span{ display: block; } } #address-form, #access-form{ max-width: 430px; display: inline-block } #address-form .form-group, #access-form .form-group{ text-align: left; } .form-group{ margin-bottom: 0; } .form-group label{ font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; font-size: 13px; background: #fff; background: -moz-linear-gradient(top, rgba(255,255,255,1) 13px, rgba(255,255,255,0) 14px); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 13px, rgba(255,255,255,0) 14px); background: linear-gradient(to bottom, rgba(255,255,255,1) 13px, rgba(255,255,255,0) 14px); margin: 0 0 -8px 5px; vertical-align: bottom; padding: 0 4px; border-radius: 8px; color: var(--gray); color: #aeb4b8; position: relative; } div.light-bg .form-group label{ background: #fbfaf9; background: -moz-linear-gradient(top, #fbfaf9 13px, #ffffff 14px); background: -webkit-linear-gradient(top, #fbfaf9 13px,#ffffff 14px); background: linear-gradient(to bottom, #fbfaf9 13px,#ffffff 14px); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfaf9', endColorstr='#ffffff',GradientType=0 ); } .form-control[readonly]{ background-color: #fff; } .form-group textarea, .form-group select, .form-group input{ border-width: 1px; border-color: var(--gray-light); } .form-group textarea:focus, .form-group select:focus, .form-group input:focus{ box-shadow: none; outline: none; border-color: var(--libmo); } .form-group:focus-within label{ color: var(--libmo); } .form-group label.error{ color: var(--red); } @media (min-width: 1200px){ .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 980px; } } #pricing .container{ max-width: 700px; } .text-danger[data-target="#deleteLibModal"]{ color: #a9acaf!important; } .text-danger[data-target="#deleteLibModal"]:hover{ color: #dc3545!important; } .cat-row .btn-outline-danger, .worker-row .btn-outline-danger { color: #999c9f; border-color: #b9bcbf; } .cat-row .btn-outline-danger:hover, .worker-row .btn-outline-danger:hover{ color: #fff; } .list-group-item:first-child { border-top-left-radius: .4rem; border-top-right-radius: .4rem; } .table .thead-dark th{ background-color: #6c757d; border-color: #6c757d; font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; font-weight: 400; border-top: none; } .table .thead-dark tr th:first-child{ border-top-left-radius: 9px; } .table .thead-dark tr th:last-child{ border-top-right-radius: 9px; } .table-striped tbody tr:nth-of-type(odd){ background-color: #e9ecef; } #invoice-rows a{ color: #fd7737; } #invoice-rows a:hover{ color: #e58f45; } #invoice-rows th[scope="row"]{ font-family: monospace; font-weight: 400; font-size: 14px; line-height: 24px; } .btn:hover{ -webkit-transition: transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out; transform: scale(1.03); } @keyframes modal-video{from{opacity:0}to{opacity:1}}@keyframes modal-video-inner{from{transform:translate(0, 100px)}to{transform:translate(0, 0)}}.modal-video{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);z-index:1000000;cursor:pointer;opacity:1;animation-timing-function:ease-out;animation-duration:.3s;animation-name:modal-video;-webkit-transition:opacity .3s ease-out;-moz-transition:opacity .3s ease-out;-ms-transition:opacity .3s ease-out;-o-transition:opacity .3s ease-out;transition:opacity .3s ease-out}.modal-video-close{opacity:0}.modal-video-close .modal-video-movie-wrap{-webkit-transform:translate(0, 100px);-moz-transform:translate(0, 100px);-ms-transform:translate(0, 100px);-o-transform:translate(0, 100px);transform:translate(0, 100px)}.modal-video-body{max-width:940px;width:100%;height:100%;margin:0 auto;display:table}.modal-video-inner{display:table-cell;vertical-align:middle;width:100%;height:100%}.modal-video-movie-wrap{width:100%;height:0;position:relative;padding-bottom:56.25%;background-color:#000;animation-timing-function:ease-out;animation-duration:.3s;animation-name:modal-video-inner;-webkit-transform:translate(0, 0);-moz-transform:translate(0, 0);-ms-transform:translate(0, 0);-o-transform:translate(0, 0);transform:translate(0, 0);-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-ms-transition:-ms-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out}.modal-video-movie-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%}.modal-video-close-btn{position:absolute;z-index:2;top:-35px;right:-35px;display:inline-block;width:35px;height:35px;overflow:hidden;border:none;background:transparent}.modal-video-close-btn:before{transform:rotate(45deg)}.modal-video-close-btn:after{transform:rotate(-45deg)}.modal-video-close-btn:before,.modal-video-close-btn:after{content:'';position:absolute;height:2px;width:100%;top:50%;left:0;margin-top:-1px;background:#fff;border-radius:5px;margin-top:-6px} .demovideo-play { position: relative; cursor: pointer; } .demovideo-play img{ opacity: 0.35; transition: opacity 0.5s ease-in-out; -webkit-animation-name: fadeBack; -webkit-animation-duration: 4.0s; animation-name: fadeBack; animation-duration: 4.0s; cursor: pointer; } @-webkit-keyframes fadeBack{ from { opacity: 1; } to { opacity: 0.35; } } @keyframes fadeBack{ from { opacity: 1; } to { opacity: 0.35; } } .demovideo-play:hover img{ opacity: 0.25; } .demovideo-play .btn{ position: absolute; top: 70%; left: 52.35%; width: 80px; height: 58px; padding: 0; margin-top: -34px; margin-left: -49px; background: none; box-shadow: none; z-index: 1; cursor: pointer; } .demovideo-play .btn { animation-name: pulse; animation-duration: 1.6s; animation-iteration-count: infinite; } @keyframes pulse { from { transform: scale(1); } 50% { transform: scale(1.08); } to { transform: scale(1); } } @media (min-width: 768px){ .demovideo-play .btn{ margin-left: -54px; } .demovideo-play:hover .ytp-large-play-button-bg{ fill: #fd7737; fill-opacity: 1; } .demovideo-play:hover .ytp-large-play-button-bg:hover{ fill: #fd7737; } } @media (min-width: 960px){ .demovideo-play .btn{ margin-left: -61px; } } @media (min-width: 1280px){ .demovideo-play .btn{ margin-left: -66px; } } @media (min-width: 1640px){ .demovideo-play .btn{ margin-left: -72px; } } @media (min-width: 1900px){ .demovideo-play .btn{ margin-left: -80px; } } .demovideo-play .videotitle{ position: absolute; top: 83%; left: 50%; width: 176px; margin-left: -88px; padding: 2px 1px 1px 0; color: var(--cta); z-index: 1; cursor: pointer } header .demovideo-play .videotitle{ color: #fff; text-shadow: 0 0 30px #20998D, 0 0 3px #20998D; background: rgba(32,153,141,0.5); border-radius: 18px; } @media (min-width: 960px){ .demovideo-play .videotitle{ top: 80%; } } .demovideo-play:hover .videotitle{ font-weight: bold; text-decoration: underline; } .demovideo-play.portrait .btn{ top: 42%; margin-left: -38px; } .demovideo-play.portrait .videotitle{ top: 51%; width: 180px; margin-left: -83px; text-align: center; } .card_box{ width: 100%; display: inline-block; text-align: left; padding: 3px; border-radius: .4rem } .card_label{ font-family: 'Exo 2', Segoe UI, Roboto, system-ui, Ubuntu, "Helvetica Neue", Noto, Helvetica, Arial, sans-serif; text-align: left; padding: 1px 0 4px 8px; margin-bottom: 0; font-size: 14px; } #card-errors{ font-size: 94%; padding: 3px 5px 0 7px; } .StripeElement { box-sizing: border-box; width: 100%; height: 40px; padding: 10px 12px; border: 1px solid #6c757d; border-radius: 4px; background-color: white; -webkit-transition: border 150ms ease; transition: border 150ms ease; } .StripeElement--focus { box-shadow: inset 0 1px 3px 0 #cfd7df; } .StripeElement--invalid { border-color: #fa755a; } .StripeElement--webkit-autofill { background-color: #fefde5 !important; } #overlay{ position: fixed; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); opacity: 0.75; z-index: 100000000; } #overlay div{ position: absolute; left: 50%; top: 50%; height:60px; width:60px; margin:0px auto; -webkit-animation: rotation .6s infinite linear; -moz-animation: rotation .6s infinite linear; -o-animation: rotation .6s infinite linear; animation: rotation .6s infinite linear; border-left: 6px solid #05796e; border-right: 6px solid #009688; border-bottom: 6px solid #009688; border-top: 6px solid #009688; border-radius:100%; } @-webkit-keyframes rotation { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(359deg);} } @-moz-keyframes rotation { from {-moz-transform: rotate(0deg);} to {-moz-transform: rotate(359deg);} } @-o-keyframes rotation { from {-o-transform: rotate(0deg);} to {-o-transform: rotate(359deg);} } @keyframes rotation { from {transform: rotate(0deg);} to {transform: rotate(359deg);} } .custom-control-input:checked~.custom-control-label::before { border-color: #009688; background-color: #009688; } .cat-row{ padding-right: 32px; padding-left: 8px; } .sortable-placeholder{ list-style: none; margin-left: -16px; color: #e58f45; } .cat-row .handle{ position: absolute; right: 0; top: 0; color: rgba(0,0,0,.45); padding: 14px 8px 14px 5px; cursor: ns-resize; } .cat-row .cat-name{ padding-left: 7px; padding-right: 75px; } #cookie_hint{ position: fixed; width: 100%; right: 0; bottom: 0; background-color: #ecf0f4; background-color: #F1F5F9; background-color: #191919; background: #fff; box-shadow: 0 0px 38px rgba(0, 0, 0, 0.3), 0 0px 12px rgba(0, 0, 0, 0.22); z-index: 100; animation: cookie_hint_slidein 500ms ease-out; cursor: pointer; color: #959094; text-align: center; } @keyframes cookie_hint_slidein{ 0% { transform: translateY(80px); } 100% { transform: translateY(0px); } } #cookie_hint > div{ padding: 27px 24px 24px 24px; } #cookie_hint a:hover{ text-decoration: underline; } #cookie_hint .btn{ margin: 0 0 0px 12px; cursor: pointer; float: right; font-size: 14px; padding: 2px 8px 1px 7px; transform: scale(0.8); } #cookie_hint:hover .btn{ transform: scale(1); } #cookie_hint > div:after{ content: ' '; clear: both; display: block; } @media (max-width: 1275px){ #cookie_hint{ text-align: left; } #cookie_hint > div{ padding: 20px 19px 19px 19px; } #cookie_hint .btn{ margin: 6px -5px -8px 0; } } .taskseparation img{ height: 200px; } .taskseparation img.sep{ position: absolute; width: 260px; height: auto; top: 57px; left: -18px; z-index: 1; } .taskseparation p{ max-width: 232px; margin: auto; } @media (max-width: 991px){ .taskseparation img{ height: 140px; } .taskseparation img.sep{ width: 194px; top: 86px; left: -10px; } } @media (max-width: 767px){ .taskseparation img{ height: 100px; } .taskseparation img.sep{ width: 134px; top: 90px; left: calc(75% - 64px); } .taskseparation p{ font-size: 12px; } }