%PDF- %PDF-
Direktori : /mnt/tnb2/los/backend/css/ |
Current File : //mnt/tnb2/los/backend/css/front.css |
/* ============================= Google font ================================ */ @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900"); @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900"); @import url("https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700;800;900"); @import url("https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;600;700;900"); @import url("https://use.fontawesome.com/releases/v5.15.4/css/all.css"); @import url("https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900"); @import url("https://fonts.googleapis.com/css?family=Jost"); @import url("https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;500;600;700;800;900"); :root { color-scheme: light dark; } ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #fcfcfc; } ::-webkit-scrollbar-thumb { background: #d2d2d2; } /* ============================= Typography ================================ */ html { scrollbar-color: #d2d2d2 #fcfcfc; scrollbar-width: thin; position: relative; min-height: 100%; width: 100%; } body { font-family: -apple-system, BlinkMacSystemFont, "Poppins", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; margin: 0 auto; font-size: 14px; color: #212529; background-color: #fafdff; } h1, h2, h3, h4, h5, h6 { font-family: -apple-system, BlinkMacSystemFont, "Montserrat", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; font-weight: 600; } h1 { font-size: 3em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.15em; } h2 { font-size: 2em; font-weight: 700; } h4 { font-weight: 800; text-transform: uppercase; } /* ============================= Forms ================================ */ .dropdown-item, .dropdown-item.active.selected, .bg-white, .accordion-button, .accordion-body { font-size: 13px; } .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) { width: 100%; } .bs-actionsbox .btn-group button { font-size: 10px; } .bootstrap-select>.dropdown-toggle { white-space: inherit; } .btn-link { --bs-btn-color: unset; text-decoration: unset; } .btn-link:hover, .btn.show, .btn:first-child:active { color: #d2042d; } .bg-blue { color: var(--bs-accordion-active-color); } .bg-accordion:not(.collapsed) { color: var(--bs-accordion-active-color); background-color: var(--bs-accordion-active-bg); box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color); } .filter-option { font-size: 13px; } p { text-align: justify; } .form-control[readonly] { color: #6c757d; background-color: #fcfcfc; } /* ============================= Layout ================================ */ .wrapper { position: relative; margin-top: 100px; } .main { position: relative; padding-bottom: 60px; } .header { position: fixed; left: 0; top: 0; right: 0; /*transition: all 0.5s;*/ z-index: 997; background-color: #fff; } .navbar { padding: 4px; } .nav-item { font-family: -apple-system, BlinkMacSystemFont, "Raleway", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; font-size: 12px; font-weight: 800; text-transform: uppercase !important; padding: 5px; } .nav-link { color: #212529; padding: 2px 0px 4px; } .nav-link.login { background-color: #d2042d; color: #f7f7f7 !important; } /* ============================= Custom ================================ */ .bd-callout { padding: 1.25rem; margin-top: 1.25rem; margin-bottom: 1.25rem; background-color: var(--bd-callout-bg, var(--bs-gray-100)); border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300)); } .bd-callout.bc { border-left: 0.25rem solid #b52d15; } .bd-callout-info { --bd-callout-bg: rgba(var(--bs-info-rgb), .075); --bd-callout-border: rgba(var(--bs-info-rgb), .5); } .bd-callout-warning { --bd-callout-bg: rgba(var(--bs-warning-rgb), .075); --bd-callout-border: rgba(var(--bs-warning-rgb), .5); } .bd-callout-danger { --bd-callout-bg: rgba(var(--bs-danger-rgb), .075); --bd-callout-border: rgba(var(--bs-danger-rgb), .5); } .division-pi, .division-mpi, .division-re, .division-mre, .division-opt, .division-com { cursor: pointer; background-color: #eee; } .visit-pi { background-color: #c70039 !important; color: #fff !important; border-color: #c70039 !important } .visit-mpi { background-color: #800080 !important; color: #fff !important; border-color: #800080 !important } .visit-re { background-color: #008000 !important; color: #fff !important; border-color: #008000 !important } .visit-mre { background-color: #008080 !important; color: #fff !important; border-color: #008080 !important } .visit-opt { background-color: #000080 !important; color: #fff !important; border-color: #000080 !important } .visit-com { background-color: #e57700 !important; color: #fff !important; border-color: #e57700 !important } .visit-pop { background-color: #ff7700 !important; color: #fff !important; border-color: #ff7700 !important } .badge { font-size: 11px; font-weight: normal; color: var(--bs-font-sans-serif); border-radius: var(--bs-border-radius-sm); } #consent---X { position: fixed; bottom: 0; left: 0; margin: 0; background-color: #eee; border-top: #ddd 1px solid; padding: .5em 1em; width: 100%; text-align: center; font-size: .75em; z-index: 999; display: flex; justify-content: center; align-items: center; } .dropdown-toggle::after { content: unset; } .dropdown-item:focus, .dropdown-item:hover { /*background-color: unset;*/ } .dropdown-item.active, .dropdown-item:active { color: var(--bs-dropdown-link-hover-color); text-decoration: none; background-color: var(--bs-dropdown-link-hover-bg); } /* ============================= Responsive ================================ */ @media (max-width: 992px) { .nav-link, .nav-link.login { width: max-content; padding: 5px 16px; } .dropdown-menu { --bs-dropdown-border-width: 0; } .navbar-nav { max-height: 75vh; overflow-y: auto; } .line { border-bottom: 1px solid #ccc; } .info { text-align: inherit !important; } .badge { margin-bottom: .5rem !important; } } .navbar-nav .nav-link.active, .navbar-nav .show>.nav-link { color: #d2042d; } .navbar-toggler, .navbar-toggler:focus { border: none; box-shadow: none; } a { color: #212529; text-decoration: unset; } a:hover { color: #d2042d; text-decoration: unset; } .logo { font-size: 13px; text-transform: uppercase; font-weight: 600; } .info { font-size: 20px; text-align: right; } .text-open { --bs-text-opacity: 1; color: var(--bs-accordion-active-color) !important; } .proposition-max, .proposition-min { cursor: pointer; } div.py-3.show { color: #d2042d; /*font-weight: bold;*/ } @media (min-width: 992px) { .logo { /*background-image:url('../images//logo_long.jpg');*/ display: none; } } @media (max-width: 575px) { .card.rounded-0.mb-3 { margin: 0 -12px; } } .single, .single-color-1, .single-color-2, .single-color-3 { background-color: #fff; padding: 40px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .single-color-1 { background-color: #b52d15; color: #fff; } .single-color-2 { background-color: #292d33; color: #fff; } .single-color-3 { background-color: #4d5656; color: #fff; } .single:hover, .single-color-1:hover, .single-color-2:hover, .single-color-3:hover { cursor: pointer; } .single:hover h4 { color: #d2042d; } .single-color-1:hover h4, .single-color-2:hover h4, .single-color-3:hover h4 { color: #ffa500; } .single h4, .single-color-1 h4, .single-color-2 h4, .single-color-3 h4 { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; margin-top: 20px; margin-bottom: 20px; } .single h4 .lnr, .single-color-1 h4 .lnr, .single-color-2 h4 .lnr, .single-color-3 h4 .lnr { margin-right: 15px; } h4 .far, h4 .fas { margin-right: 12px; } .accordion { --bs-accordion-btn-focus-box-shadow: 0; } .accordion-button:before { display: none; } .accordion-button:after { order: -1; margin-left: 0; margin-right: 20px; display: none; } .accordion-button:hover { color: var(--bs-accordion-active-color); } .accordion-button:not(.collapsed), .accordion-button:not(.collapsed):focus { box-shadow: none; } /* ============================= Footer ================================ */ footer { position: absolute; left: 0; bottom: 0; height: 60px; width: 100%; padding-top: 24px; } .copyright { font-family: -apple-system, BlinkMacSystemFont, "Titillium Web", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; font-size: 10px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.15em; } @media (max-width: 1199px) { footer { margin-bottom: 20px; padding-top: 32px; } .wrapper { margin-top: 70px; } } /* ============================= Dark scheme ================================ */