* { margin: 0; padding: 0; text-decoration: none; max-width: 100%; } body { background-color: #fff !important; overflow-x: hidden; height: 100%; font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif !important; } html { scroll-behavior: smooth; } .iziToast-wrapper { bottom: 75px !important; z-index: 9999999999999999999 !important; } .iziToast-message { color: black !important } .nav-wrapper { width: 100%; position: -webkit-sticky; /* Safari */ position: sticky; top: 0; background-color: #fff; } .grad-bar { width: 100%; height: 5px; background: linear-gradient(-45deg,#EE7752,#E73C7E,#23A6D5,#23D5AB); background-size: 400% 400%; -webkit-animation: gradbar 15s ease infinite; -moz-animation: gradbar 15s ease infinite; animation: gradbar 15s ease infinite; z-index: 9999999999999; position: fixed; } /* NAVIGATION */ .navbar { display: grid !important; grid-template-columns: 1fr 3fr; align-items: center; height: 60px; overflow: hidden; width: 100% !important; position: fixed !important; background: #fff; } .navbar img { height: 30px; width: auto; justify-self: start; margin-left: 20px; } .navbar ul { list-style: none; justify-self: end; width: 60%; justify-content: end; display: table; } .nav-item a { color: #000; font-size: 14px; font-weight: 600; text-decoration: none; transition: color 0.3s ease-out; text-transform: uppercase; letter-spacing: 1px; } .nav-item { text-align: center; margin-right: 50px; display: table-cell; vertical-align: middle; } .nav-item a:hover { color: #5E24C3; } /* SECTIONS */ .headline { width: 100%; height: 50vh; min-height: 350px; background: linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.7)),url('https://d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/jPLiQ-9/mountains-background-for-titles-intro-projects-and-etc_ew22rur3l__F0000.png'); background-size: cover; display: flex; flex-direction: column; justify-content: center; } .features { width: 100%; height: auto; background-color: #f1f1f1; display: flex; padding: 50px 20px; justify-content: space-around; } .feature-container { flex-basis: 30%; margin-top: 10px; } .feature-container p { color: #000; text-align: center; line-height: 1.4; margin-bottom: 15px; } .feature-container img { width: 100%; margin-bottom: 15px; } /* MOBILE MENU & ANIMATION */ .menu-toggle .bar { width: 25px; height: 3px; background-color: #3f3f3f; margin: 5px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .menu-toggle { justify-self: end; margin-right: 25px; display: none; } .menu-toggle:hover { cursor: pointer; } #mobile-menu.is-active .bar:nth-child(2) { opacity: 0; } #mobile-menu.is-active .bar:nth-child(1) { -webkit-transform: translateY(8px) rotate(45deg); -ms-transform: translateY(8px) rotate(45deg); -o-transform: translateY(8px) rotate(45deg); transform: translateY(8px) rotate(45deg); } #mobile-menu.is-active .bar:nth-child(3) { -webkit-transform: translateY(-8px) rotate(-45deg); -ms-transform: translateY(-8px) rotate(-45deg); -o-transform: translateY(-8px) rotate(-45deg); transform: translateY(-8px) rotate(-45deg); } /* KEYFRAME ANIMATIONS */ @-webkit-keyframes gradbar { 0% { background-position: 0% 50% } 50% { background-position: 100% 50% } 100% { background-position: 0% 50% } } @-moz-keyframes gradbar { 0% { background-position: 0% 50% } 50% { background-position: 100% 50% } 100% { background-position: 0% 50% } } @keyframes gradbar { 0% { background-position: 0% 50% } 50% { background-position: 100% 50% } 100% { background-position: 0% 50% } } /* Media Queries */ /* Mobile Devices - Phones/Tablets */ @media only screen and (max-width: 1200px) { .features { flex-direction: column; padding: 50px; } /* MOBILE HEADINGS */ h1 { font-size: 1.9rem; } h2 { font-size: 1rem; } p { font-size: 0.8rem; } /* MOBILE NAVIGATION */ .navbar ul { display: flex; flex-direction: column; position: fixed; justify-content: start; top: 55px; background-color: #fff; width: 100%; height: calc(100vh - 55px); transform: translate(-101%); text-align: center; overflow: hidden; left: 0px; } .navbar li { padding: 15px; margin-right: 0px; } .navbar li:first-child { margin-top: 50px; } .navbar li a { font-size: 1rem; } .menu-toggle,.bar { display: block; cursor: pointer; } .mobile-nav { transform: translate(0%) !important; } /* SECTIONS */ .headline { height: 20vh; } .feature-container p { margin-bottom: 25px; } .feature-container { margin-top: 20px; } .feature-container:nth-child(2) { order: -1; } /* SEARCH DISABLED ON MOBILE */ #search-icon { display: none; } .search-input { display: none; } } .site-footer { background-color: #26272b; padding: 45px 0 20px; font-size: 15px; line-height: 24px; color: #737373; } .site-footer hr { border-top-color: #bbb; opacity: 0.5 } .site-footer hr.small { margin: 20px 0 } .site-footer h6 { color: #fff; font-size: 16px; text-transform: uppercase; margin-top: 5px; letter-spacing: 2px } .site-footer a { color: #737373; } .site-footer a:hover { color: #3366cc; text-decoration: none; } .footer-links { padding-left: 0; list-style: none } .footer-links li { display: block } .footer-links a { color: #737373 } .footer-links a:active,.footer-links a:focus,.footer-links a:hover { color: #3366cc; text-decoration: none; } .footer-links.inline li { display: inline-block } .site-footer .social-icons { text-align: right } .site-footer .social-icons a { width: 40px; height: 40px; line-height: 40px; margin-left: 6px; margin-right: 0; border-radius: 100%; background-color: #33353d } .copyright-text { margin: 0 } @media (max-width:991px) { .site-footer [class^=col-] { margin-bottom: 30px } } @media (max-width:767px) { .site-footer { padding-bottom: 0 } .site-footer .copyright-text,.site-footer .social-icons { text-align: center } } .social-icons { padding-left: 0; margin-bottom: 0; list-style: none } .social-icons li { display: inline-block; margin-bottom: 4px } .social-icons li.title { margin-right: 15px; text-transform: uppercase; color: #96a2b2; font-weight: 700; font-size: 13px } .social-icons a { background-color: #eceeef; color: #818a91; font-size: 16px; display: inline-block; line-height: 44px; width: 44px; height: 44px; text-align: center; margin-right: 8px; border-radius: 100%; -webkit-transition: all .2s linear; -o-transition: all .2s linear; transition: all .2s linear } .social-icons a:active,.social-icons a:focus,.social-icons a:hover { color: #fff; background-color: #5E24C3 } .social-icons.size-sm a { line-height: 34px; height: 34px; width: 34px; font-size: 14px } @media (max-width:767px) { .social-icons li.title { display: block; margin-right: 0; font-weight: 600 } } table.table-sm th,table.table-sm td { padding-top: .2rem !important; padding-bottom: .2rem !important; } @keyframes new_spot_color { 0% { background: limegreen; } 100% { background: transparent; } } .panel-heading:hover { cursor: pointer; } .panel-heading .chevron:after { content: "\f078"; } .panel-heading.collapsed .chevron:after { content: "\f054"; } .btn-rounded { border-radius: 15rem !important; } table.table-sm th,table.table-sm td { padding-left: .5rem; } .spinner>svg { width: 100%; height: 100%; stroke: #444; fill: #444; } .cursor_hover:hover { cursor: pointer; } .close:hover { cursor: pointer; } .close { line-height: 0.75 !important; margin-left: 20px; } .row { margin-right: 0px !important; margin-left: 0px !important; } .input-group-text-own { display: block; width: 125px; } rect { stroke-width: 0.1; stroke: rgb(0,0,0); } .autocomplete-items { position: absolute; border: 1px solid #d4d4d4; border-bottom: none; border-top: none; z-index: 99; /*position the autocomplete items to be the same width as the container:*/ left: 0; right: 0; margin-top: 45px } .autocomplete-items div { padding: 10px; cursor: pointer; background-color: #fff; border-bottom: 1px solid #d4d4d4; } /*when hovering an item:*/ .autocomplete-items div:hover { background-color: #e9e9e9; } /*when navigating through the items using the arrow keys:*/ .autocomplete-active { background-color: DodgerBlue !important; color: #ffffff; } .profile-user-info { display: table; width: 98%; width: calc(100% - 24px); margin: 0 auto } .profile-info-row { display: table-row } .profile-info-name,.profile-info-value { display: table-cell; border-bottom: 1px dotted #3d3d3d; } .profile-info-name { color: #667E99; } .btn-group-rounded-left { border-radius: 0px !important; border-bottom-left-radius: 15rem !important; border-top-left-radius: 15rem !important; } .btn-group-rounded-right { border-radius: 0px !important; border-bottom-right-radius: 15rem !important; border-top-right-radius: 15rem !important; } body.modal-open { overflow: visible; position: inherit } .popover { max-width: max-content; } .align-super { vertical-align: super; } .filepond--root { margin-right: 10px; } .filepond--drop-label { color: #4c4e53; } .filepond--label-action { text-decoration-color: #babdc0; } .filepond--panel-root { background-color: #e9ecef; border: 1px solid #ced4da; border-radius: .25rem; } .filepond--item-panel { background-color: #595e68; } .filepond--drip-blob { background-color: #7f8a9a; } .filepond--item { width: calc(50% - 0.5em); } @media (min-width: 30em) { .filepond--item { width: calc(50% - 0.5em); } } @media (min-width: 50em) { .filepond--item { width: calc(33.33% - 0.5em); } } input:required,select:required { border-color: tomato; } .semi-required { border-style: dashed; } table.table thead th { font-weight: bold !important; } .dtsp-searchPanes .btn { padding: .375rem .75rem !important; margin: 0px !important; box-shadow: none !important; margin-left: -1px !important; background-color: #f8f9fa !important; } div.dtsp-panesContainer div.dtsp-searchPane div.dtsp-topRow button { width: 50px !important; } .dt-info { text-align: center; margin-bottom: 15px; font-style: italic; } div.dt-container div.dt-paging ul.pagination { width: fit-content; margin: 0 auto !important; }