@font-face { font-family: 'Euclid'; src: url('euclid/EuclidCircularA-Regular.woff'); } body { display: flex; flex-direction: column; min-height: 100vh; width: 100%; font-family: 'Euclid'; /* background-color: #FAFAFA; */ } footer { margin-top: auto; } :root { --pry-color: #5AC8FA; --pry-dark-color: #08415C; --sec-color: #FDE1AF; } ::-moz-selection { background: var(--pry-color); color: #fff; } ::selection { background: var(--pry-color); color: #fff; } .logo { width: 90%; } nav.navbar { width: 100%; border-bottom: 1px solid #eee; background-color: #fff; z-index: 100; padding: 0; } nav .container-fluid{ height: 60px; /* padding: 0 50px; */ } .navbar-nav { margin-left: 240px; margin-bottom: 0; } .navbar.navBarWeb { height: 60px; box-shadow: 0px 6px 4px rgba(43, 67, 80, 0.01); border-bottom: none; } .navbar-nav li{ display: inline; padding-left: 10px; font-size: 16px; line-height: 20px; text-transform: capitalize; } #navBarWeb li { padding-right: 20px; padding-left: 0; font-size: 17px; font-weight: 400; } .navbar-nav li a { color: #000000; font-weight: 400; border-bottom:1px solid rgba(0,0,0,0); transition: 0.5s; } .navbar-nav li a:hover { color: var(--pry-color); transition: 0.5s; } .nav-item { position: relative; } .nav-item.active::after { content: url('/img/dashboard/active_link.svg'); position: absolute; right: 54%; bottom:-8px; } .nav-item a { color: var(--pry-dark-color); } .nav-item a:hover, .nav-item.active a { color: var(--pry-color); } a:hover { text-decoration: none; } .search-form { display: flex; align-items: center; width: 100%; } .search-field::placeholder { color: #8E8E93; font-weight: 200; } .search-field, .search-field:focus { border:none; outline: none; border-left:1px solid #eee; padding: 12px; width: 350px; } .submit-search { height: 42px; width: 42px; border-radius: 100%; display: flex; justify-content: center; align-items: center; border:none; background-color: var(--pry-color); } .submit-search:hover { background-color: var(--pry-dark-color); transition: 0.4s; } .user { position: relative; height: 40px; } .user::after { font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f111"; font-size: 15px; position: absolute; bottom:-8px; left:45px; color:#34C759; border-radius: 100%; } .flex-row { display: flex; justify-content: space-between; } .flex-inner-row { display: flex; justify-content: space-between; } .flex-inner-row > div { width: 50%; } .custom-card { background-color: #ffffff; box-shadow: 0px 100px 80px rgba(76, 97, 110, 0.07), 0px 41.7776px 33.4221px rgba(76, 97, 110, 0.030149), 0px 22.3363px 17.869px rgba(76, 97, 110, 0.0134937), 0px 12.5216px 10.0172px rgba(76, 97, 110, 0.00523753), 0px 6.6501px 5.32008px rgba(76, 97, 110, 0.00118705); padding: 30px; position: relative; } .custom-card.overflow { overflow: auto; } [moe] { display: block; } .table-wrap { padding: 0 !important; } .table-wrap table { table-layout: fixed; } .custom-card th { color: #8E8E93; border:none; vertical-align: inherit !important; font-weight: 500; font-size: 15px; line-height: 20px; } .custom-card td { font-weight: 500; font-size: 14px; line-height: 19px; } .custom-card h4 { font-weight: 500; font-size: 34px; line-height: 41px; letter-spacing: 0.374px; } .flex-stats { display: flex; align-items: center; } .flex-stats div { margin-left: 12px; } .flex-stats h4 { font-weight: 600; font-size: 44px; line-height: 41px; letter-spacing: 0.35px; } .text-purple { color: #5856D6; } .text-blue{ color: var(--pry-color); } .text-green{ color: #34C759; } .text-red{ color: #FF3B30; } .text-orange{ color: #FF9F0A; } .hidden, .mobile, .tab, .sm-screen, .tab-search { display: none; } .btn-pry { background-color: var(--pry-dark-color); color: #fff; padding: 7px 30px; } .btn-pry:hover { background-color: var(--pry-color); color: #fff; } .pry-sm { padding: 7px 20px; } .flex-links { display: flex; justify-content: space-between; } .flex-links a { width: 100%; color: #000000; display: flex; align-items: center; position: relative; padding: 27px; } .flex-links a:not(:last-child) { margin-right: 20px; } .flex-links a:not(:first-child) { margin-left: 20px; } .flex-links a::before { margin-right: 10px; } .flex-links .onboarded::before { content: url('/img/dashboard/onboarded.svg'); } .flex-links .pending::before { content: url('/img/dashboard/pending.svg'); } .flex-links .ineligible::before { content: url('/img/dashboard/ineligible.svg'); } .flex-links .onboarded.active::before { content: url('/img/dashboard/onboarded-active.svg'); } .flex-links .pending.active::before { content: url('/img/dashboard/pending-active.svg'); } .flex-links .ineligible.active::before { content: url('/img/dashboard/ineligible-active.svg'); } .flex-links .onboarded.active { background-color: #34C759; } .flex-links .pending.active { background-color: #FF9F0A; } .flex-links .ineligible.active { background-color: #FF3B30; } .flex-links a.active { filter: drop-shadow(0px 100px 80px rgba(190, 190, 190, 0.07)), drop-shadow(0px 41.7776px 33.4221px rgba(190, 190, 190, 0.0503198)), drop-shadow(0px 22.3363px 17.869px rgba(190, 190, 190, 0.0417275)), drop-shadow(0px 12.5216px 10.0172px rgba(190, 190, 190, 0.035)), drop-shadow(0px 6.6501px 5.32008px rgba(190, 190, 190, 0.0282725)), drop-shadow(0px 2.76726px 2.21381px rgba(190, 190, 190, 0.0196802)); } .flex-links .onboarded h4 { color: #34C759; } .flex-links .pending h4 { color: #FF9F0A; } .flex-links .ineligible h4 { color: #FF3B30; } .flex-links a.active h4, .flex-links a.active { color: #fff; } .patient-avatar { height: 40px; width: 40px; display: flex; justify-content: center; align-items: center; background-color: #eee; box-shadow: 0px 100px 80px rgba(76, 97, 110, 0.07), 0px 41.7776px 33.4221px rgba(76, 97, 110, 0.030149), 0px 22.3363px 17.869px rgba(76, 97, 110, 0.0134937), 0px 12.5216px 10.0172px rgba(76, 97, 110, 0.00523753), 0px 6.6501px 5.32008px rgba(76, 97, 110, 0.00118705); border-radius: 100%; } @media screen and (max-width:1024px) { .search-field { width: 250px; } } @media screen and (max-width:991px) { .navBarWeb, .web, .patient-avatar { display: none !important; } .mobile, .tab { display: block; } .table-wrap table { table-layout: auto; } #navBar { position: absolute; width: 100%; background-color: #ffffff; top: 64px; right: 0; padding: 1px 10px 1px; border-top: 1px solid #eee; } .navbar-nav { margin-left: 0; } .navbar-nav li{ display: block; } .nav-item { border-bottom: 1px solid #eee; padding: 10px 0px; } .sidebar .nav-item { border-bottom: none; } .nav-links { position: absolute; right: 60px; top:18px; } .nav-links ul{ list-style: none; } .nav-links ul li{ display: inline-block; margin-right: 10px; } .logo { margin-left: 10px; } .navbar-toggler { color: var(--pry-dark-color); border:1px solid var(--pry-dark-color); background-color: #fff; padding: 12px; margin-bottom: 0; margin-right: 12px; } .navbar-toggler:hover { background-color: var(--pry-color); color: #fff; } nav { padding: 0 10px; } .flex-row { display: block; } .custom-card { width: 100%; margin-bottom: 40px; } .tab-search { display: block; background-color: #ffffff; padding: 5px 0; padding-right:12px; } .search-field, .search-field:focus { width: 100%; } .submit-search { height: 42px; width: 46px; } .flex-links { flex-wrap: wrap; } .flex-links a { width: 48%; } .flex-links a:not(:last-child), .flex-links a:not(:first-child) { margin:0; } .flex-links a{ margin-bottom: 20px !important; } } @media screen and (max-width:545px) { .sm-screen { display: block; padding: 12px 0; margin: 0; margin-bottom: -10px; } .flex-links a { width: 32%; padding: 14px; } .flex-links a.active::before, .flex-links a::before { content: none !important; } .tab { display: none; } .flex-inner-row { flex-wrap: wrap; margin-top: 0 !important; } .flex-inner-row >div{ width: 100%; } .flex-stats h4 { font-size: 37px; } .custom-card { padding: 40px 20px; } .navbar .container-fluid { flex-wrap: nowrap; } .statuses { font-size: 16px; } } @media screen and (max-width:400px) { .flex-links a { width: 100%; } .nav-tabs .nav-item { width: 100%; } } @media screen and (max-width:325px) { .statuses { font-size: 14px; } .sm-screen { display: block; } .flex-stats img { display: none; } .tab { display: none; } }