/* // Pandora FMS - the Flexible Monitoring System // ============================================= // Copyright (c) 2004-2023 Pandora FMS // This program is free software; you can redistribute it and/or // modify it under the terms of the GNU General Public License // as published by the Free Software Foundation; version 2 // This program is distributed in the hope that it will be useful, // but WITHOUT ANY WARRANTY; without even the implied warranty of // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the // GNU General Public License for more details. // You should have received a copy of the GNU General Public License // along with this program; if not, write to the Free Software // Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ @font-face { font-family: "Circular Std Book"; src: url("../../fonts/CircularStd-Book.woff") format("woff"); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: "Circular Std"; src: url("../../CircularStd-Medium.woff") format("woff"); font-weight: 500; font-style: normal; font-display: swap; } html { background-image: url("../../images/installer-background.jpg"); background-position: center; background-size: cover; } #install_container { max-width: 1000px; margin: 0 auto; margin-top: 50px; background-color: #131727; color: white; font-family: "Circular Std Book"; border-radius: 10px; } #wizard { padding: 20px; overflow: hidden; } .title { font-size: 40px; font-weight: 400; } .subtitle { font-size: 30px; font-weight: 400; } .text { font-size: 17px; } .content-footer { padding: 20px; display: flex; align-items: center; justify-content: space-between; } .header { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; } .title-pandora { margin: 0px; font-size: 18px; } .steps { display: flex; align-items: center; } .step { font-size: 17px; border: 1px solid #8a96a6; color: #8a96a6; border-radius: 30px; width: 30px; height: 30px; text-align: center; display: flex; align-items: center; justify-content: center; } .step.active { background-color: #82b92e; color: #ffffff; border-color: #82b92e; } .step-separator { min-width: 15px; margin: 0px 5px; border-color: #8a96a6; } .build-banner { color: #8a96a6; font-size: 13px; font-weight: 300; margin-left: 20px; } #foot_install { border-top: 1px solid white; margin-top: 20px; } .signature { color: #8a96a6; font-size: 13px; font-weight: 300; margin-right: auto; margin-left: 10px; } .link { color: #82b92e; text-decoration: none; } .signature a { color: #82b92e; text-decoration: none; } .btn_primary { color: white; background-color: #82b92e; border: 20px; font-size: 15px; border-radius: 6px; padding: 10px 20px; cursor: pointer; text-decoration: none; } .btn_primary.outline { background-color: transparent; border: 1px solid white; } .info { background: #d6e2ff; color: #454545; font-size: 15px; border-radius: 5px; padding: 15px; position: relative; margin: 25px 0px; } .info::before { content: "|"; color: blue; position: absolute; left: 4px; top: 50%; transform: translateY(-50%); height: 77%; background: blue; border-radius: 12px; width: 4px; } .warn { background: #fffbdf; color: #454545; font-size: 15px; border-radius: 5px; padding: 15px; position: relative; margin: 25px 0px; } .warn::before { content: "|"; color: #dd9900; position: absolute; left: 4px; top: 50%; transform: translateY(-50%); height: 77%; background: #dd9900; border-radius: 12px; width: 4px; } .err { background: #fbdada; color: #454545; font-size: 15px; border-radius: 5px; padding: 15px; position: relative; margin: 25px 0px; } .err::before { content: "|"; color: red; position: absolute; left: 4px; top: 50%; transform: translateY(-50%); height: 77%; background: red; border-radius: 12px; width: 4px; } .check-table { background-color: #0f111b; color: #c1ccdc; padding: 10px; width: 100%; border-radius: 8px; margin-top: 20px; } .check-table td { padding: 5px 0px; } .incomplete { color: red; } .checked { color: #82b92e; } .row { display: flex; flex-wrap: wrap; justify-content: center; } .reverse { flex-direction: row-reverse; } .col-md-6 { width: 47%; position: relative; padding: 0px 10px; } .content-animation { display: flex; height: 94%; bottom: 0; position: absolute; right: 0; width: 90%; } .content-animation::before { content: ""; width: 120%; position: absolute; height: 103%; background-image: linear-gradient(225deg, #731dd854 0%, #2eb9b83d 100%); top: 0; left: 0; border-top-left-radius: 100px; } .popuphero { margin-top: 48px; margin-left: -26px; } .popupgear1 img, .popupgear2 img { height: 176px; position: absolute; } .popupgear1 img { margin: 0px 0px 0px 129px; animation: rotar1 10s infinite linear; } .popupgear2 img { margin: 130px 0px 0px 0px; animation: rotar2 10s infinite linear; } .popuplaptop img { height: 352px; position: absolute; margin: 115px 0px 0px 0px; } .login { font-size: 14px; padding: 8px 10px; border-radius: 5px; border: 0px; width: 100%; } .input-label { color: #8a96a6; font-size: 13px; margin-top: 5px; margin-bottom: 5px; } .example-message { color: #8a96a6; font-size: 8px; } .login[type="checkbox"] { width: auto; } .table-config-database td { text-align: left; } .table-config-database td.inline { display: flex; align-items: center; justify-content: flex-start; } .table-config-database td.inline .input-label { margin-left: 10px; } @keyframes rotar1 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes rotar2 { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } @media (max-width: 768px) { .col-md-6 { width: 100%; } .hide-phone { display: none; } } /* SWITCH */ .switch { position: relative; display: inline-block; width: 33px; height: 12px; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: 0.4s; transition: 0.4s; } .slider:before { position: absolute; content: ""; height: 19px; width: 19px; left: 0px; background-color: white; -webkit-transition: 0.4s; transition: 0.4s; transform: translateY(-50%); top: 50%; } input:checked + .slider { background-color: #82b92e; } input:focus + .slider { box-shadow: 0 0 1px #82b92e; } input:checked + .slider:before { -webkit-transform: translate(15px, -50%); -ms-transform: translate(15px, -50%); transform: translate(15px, -50%); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } /* POPUP */ .popup-lightbox { position: fixed; z-index: 8888; width: 100%; height: 100%; background-color: #000; opacity: 0.6; visibility: hidden; top: 0; } .popup { max-height: 450px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); z-index: 9999; display: none; font-family: "Circular Std Book"; } .popup .btn_primary.outline { color: #82b92e; border-color: #82b92e; margin: 0px 20px; } .popup-title { background-color: #82b92e; padding: 10px 20px; color: #fff; font-size: 12pt; text-align: center; border-radius: 10px 10px 0px 0px; } .popup-inner { max-height: 350px; background: #fff; /* overflow-y: scroll;*/ padding: 25px 35px; font-size: 11pt; border-radius: 0px 0px 10px 10px; } .popup-button-green { background-color: #82b92e; border: 1px solid transparent; color: #fff; } .popup-button-green span { color: #fff; } .popup-button-green:hover { background-color: transparent; border: 1px solid #82b92e; color: #82b92e; } .popup-button-green:hover span { color: #82b92e; } /* POPUP -END */