@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500&display=swap'); * { 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 } .cc_container .cc_btn { background-color: #0077c2 !important; color: white !important; max-width: 150px !important; } .cc_container { background-color: rgba(53,53,57,1) !important; color: white; border: 0px solid #ccc !important; } .cc_container a { color: red !important; } .cc_banner-wrapper { height: 60px !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; grid-template-columns: 1fr 3fr; align-items: center; height: 60px; overflow: hidden; width: 100% !important; position: fixed; background: #fff; } .navbar img { height: 30px; width: auto; justify-self: start; margin-left: 20px; } .navbar ul { list-style: none; justify-self: end; width: 100%; justify-content: end; } .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: 80px } .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; } /* SEARCH FUNCTION */ #search-icon { font-size: 0.9rem; margin-top: 3px; margin-left: 15px; transition: color 0.3s ease-out; } #search-icon:hover { color: #3498db; cursor: pointer; } .search { transform: translate(-35%); -webkit-transform: translate(-35%); transition: transform 0.7s ease-in-out; color: #3498db; } .no-search { transform: translate(0); transition: transform 0.7s ease-in-out; } .search-input { position: absolute; top: -4px; right: -125px; opacity: 0; z-index: -1; transition: opacity 0.6s ease; } .search-active { opacity: 1; z-index: 0; } /*input { border: 0; border-left: 1px solid #ccc; border-radius: 0; outline: 0; padding: 5px; }*/ /* 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: 1100px) { .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 { 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; } .compass_class { display: flex; align-items: center; justify-content: center; float: left; } .compass_needle { position: absolute; } .clock { font-size: 25px; font-family: 'Orbitron'; letter-spacing: 5px; } .row { margin-right: 0px !important; margin-left: 0px !important; } .input-group-text-own { display: block; width: 100px; } 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; } #sdr_modal { bottom: 15px !important; right: 15px !important; position: fixed; margin: 0 !important; margin-left: 15px !important; display: none; z-index: 1500; }