@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&family=Noto+Kufi+Arabic:wght@100;200;300;400;500;600;700;800;900&display=swap"); :root { --blue: #007bff; --indigo: #6610f2; --purple: #6f42c1; --pink: #e83e8c; --red: #dc3545; --orange: #fd7e14; --yellow: #ffc107; --green: #28a745; --teal: #20c997; --cyan: #17a2b8; --white: #fff; --gray: #6c757d; --gray-dark: #343a40; --primary: #007bff; --secondary: #6c757d; --success: #28a745; --info: #17a2b8; --warning: #ffc107; --danger: #dc3545; --light: #f8f9fa; --dark: #343a40; --breakpoint-xs: 0; --breakpoint-sm: 576px; --breakpoint-md: 768px; --breakpoint-lg: 992px; --breakpoint-xl: 1200px; --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-family: Noto Kufi Arabic, sans-serif } .MuiAlert-root { font-family: Noto Kufi Arabic, sans-serif !important } .MuiAlert-icon { margin-left: 10px } *, :after, :before { box-sizing: border-box } html { font-family: Noto Kufi Arabic, sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth } header, main, nav, section { display: block } body { margin: 0; font-family: Noto Kufi Arabic, sans-serif; font-size: 1rem; font-weight: 400; text-align: right; text-rendering: optimizeLegibility; color: #444; line-height: 32px; overflow-x: hidden; position: relative } .h1, h1, h2, h3, h4, h5, h6 { margin-top: 0 } ol, p, ul { margin-top: 0; margin-bottom: 1rem } ul ul { margin-bottom: 0 } b, strong { font-weight: bolder } a { color: #444; text-decoration: unset; background-color: transparent; transition: .3s } .l-active, a:hover { color: #02a4ac } .bg-main-theme { background-color: #02a4ac !important } img { vertical-align: middle; border-style: none } label { display: inline-block; margin-bottom: .5rem } button { border-radius: 0 } button:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color } button, input, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit } button, input { overflow: visible } button { text-transform: none } [type=button], [type=submit], button { -webkit-appearance: button } [type=button]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { padding: 0; border-style: none } textarea { overflow: auto; resize: vertical } ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button } .h1, h1, h2, h3, h4, h5, h6 { margin-bottom: .5rem; font-family: inherit; font-weight: 500; line-height: 1.2; color: inherit } .h1, h1 { font-size: 2.5rem } h2 { font-size: 2.25rem } h3 { font-size: 1.75rem } h4 { font-size: 1.5rem } h5 { font-size: 1.25rem } h6 { font-size: 1rem } .img-fluid, .img-thumbnail { max-width: 100%; height: auto } .img-thumbnail { padding: .25rem; background-color: #fff; border: 1px solid #dee2e6; border-radius: .25rem } .container { width: 100%; padding-left: 25px; padding-right: 25px; margin-left: auto; margin-right: auto } .w-full { width: 100% } .flex-direction-col { flex-direction: column } .cursor-pointer { cursor: pointer } .cursor-pointer:hover { opacity: .8 } .invert-hover { transition: .5s } .invert-hover:hover { filter: invert(50%) } @media (min-width:576px) { .container { max-width: 540px !important } } @media (min-width:768px) { .container { max-width: 720px !important } } @media (min-width:992px) { .header-inside .navbar-nav { padding: 2px 10px; border-radius: 12px; border: .5px solid #707070; opacity: .9 } .container { max-width: 960px !important } } @media (min-width:1440px) { .container { max-width: 1200px !important } } .container-fluid { width: 100%; padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto } .row { display: flex; flex-wrap: wrap; } .no-gutters { margin-left: 0; margin-right: 0 } .no-gutters>[class*=col-] { padding-left: 0; padding-right: 0 } .form-control { display: block; width: 100%; height: calc(2.25rem + 2px); padding: .375rem .75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .25rem; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out } @media (min-width:1450px) { .p-num { padding: 3rem 0; justify-content: center !important } footer h3 { font-size: 35px !important } } @media screen and (prefers-reduced-motion:reduce) { .form-control { transition: none } } .form-control::-ms-expand { background-color: transparent; border: 0 } .form-control:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25) } .form-control::-webkit-input-placeholder { color: #6c757d; opacity: 1 } .form-control::-moz-placeholder { color: #6c757d; opacity: 1 } .form-control:-ms-input-placeholder { color: #6c757d; opacity: 1 } .form-control::-ms-input-placeholder { color: #6c757d; opacity: 1 } .form-control:disabled { background-color: #e9ecef; opacity: 1 } .col-form-label { padding-top: calc(.375rem + 1px); padding-bottom: calc(.375rem + 1px); margin-bottom: 0; font-size: inherit; line-height: 1.5 } textarea.form-control { height: auto } .form-group { margin-bottom: 1rem } .custom-control-input.is-valid:focus:not(:checked)~.custom-control-label:before, .was-validated .custom-control-input:valid:focus:not(:checked)~.custom-control-label:before { border-color: #28a745 } .custom-control-input.is-invalid:focus:not(:checked)~.custom-control-label:before, .was-validated .custom-control-input:invalid:focus:not(:checked)~.custom-control-label:before { border-color: #dc3545 } .btn { display: inline-block; font-weight: 400; color: #212529; text-align: center; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; border-radius: .25rem; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } @media screen and (prefers-reduced-motion:reduce) { .btn { transition: none } } .btn:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25) } .btn:disabled { opacity: .65 } .btn:not(:disabled):not(.disabled) { cursor: pointer } .btn-primary { color: #fff; background-color: #02a4ac; border-color: #02a4ac } .btn-primary:hover { color: #fff; background-color: #006971; border-color: #02a4ac } .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active { color: #fff; background-color: #0062cc; border-color: #005cbf } .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(38, 143, 255, .5) } .btn-secondary { color: #fff; background-color: #6c757d; border-color: #6c757d } .btn-secondary:hover { color: #fff; background-color: #5a6268; border-color: #545b62 } .btn-secondary:focus { box-shadow: 0 0 0 .2rem hsla(208, 6%, 54%, .5) } .btn-secondary:disabled { color: #fff; background-color: #6c757d; border-color: #6c757d } .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active { color: #fff; background-color: #545b62; border-color: #4e555b } .btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem hsla(208, 6%, 54%, .5) } .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active { color: #fff; background-color: #1e7e34; border-color: #1c7430 } .btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(72, 180, 97, .5) } .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active { color: #fff; background-color: #117a8b; border-color: #10707f } .btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(58, 176, 195, .5) } .btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active { color: #212529; background-color: #d39e00; border-color: #c69500 } .btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(222, 170, 12, .5) } .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active { color: #fff; background-color: #bd2130; border-color: #b21f2d } .btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(225, 83, 97, .5) } .btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active { color: #212529; background-color: #dae0e5; border-color: #d3d9df } .btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem hsla(220, 4%, 85%, .5) } .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active { color: #fff; background-color: #1d2124; border-color: #171a1d } .btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(82, 88, 93, .5) } .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active { color: #fff; background-color: #007bff; border-color: #007bff } .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5) } .btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active { color: #fff; background-color: #6c757d; border-color: #6c757d } .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem hsla(208, 7%, 46%, .5) } .btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active { color: #fff; background-color: #28a745; border-color: #28a745 } .btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(40, 167, 69, .5) } .btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active { color: #fff; background-color: #17a2b8; border-color: #17a2b8 } .btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(23, 162, 184, .5) } .btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active { color: #212529; background-color: #ffc107; border-color: #ffc107 } .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .5) } .btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active { color: #fff; background-color: #dc3545; border-color: #dc3545 } .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .5) } .btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active { color: #212529; background-color: #f8f9fa; border-color: #f8f9fa } .btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(248, 249, 250, .5) } .btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active { color: #fff; background-color: #343a40; border-color: #343a40 } .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus { box-shadow: 0 0 0 .2rem rgba(52, 58, 64, .5) } .fade { transition: opacity .15s linear } @media screen and (prefers-reduced-motion:reduce) { .fade { transition: none } } .fade:not(.show) { opacity: 0 } .collapse:not(.show) { display: none } .collapsing { position: relative; height: 0; overflow: hidden; transition: height .35s ease } @media screen and (prefers-reduced-motion:reduce) { .collapsing { transition: none } } .custom-control-input:focus:not(:checked)~.custom-control-label:before { border-color: #80bdff } .custom-control-input:not(:disabled):active~.custom-control-label:before { color: #fff; background-color: #b3d7ff; border-color: #b3d7ff } .tooltip { position: absolute; z-index: 1070; display: block; margin: 0; font-family: Noto Kufi Arabic, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; text-align: right; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; letter-spacing: normal; word-break: normal; word-spacing: normal; white-space: normal; line-break: auto; font-size: .875rem; word-wrap: break-word; opacity: 0 } .tooltip.show { opacity: .9 } .tooltip .arrow { position: absolute; display: block; width: .8rem; height: .4rem } .tooltip .arrow:before { position: absolute; content: ""; border-color: transparent; border-style: solid } .bs-tooltip-auto[x-placement^=top], .bs-tooltip-top { padding: .4rem 0 } .bs-tooltip-auto[x-placement^=top] .arrow, .bs-tooltip-top .arrow { bottom: 0 } .bs-tooltip-auto[x-placement^=top] .arrow:before, .bs-tooltip-top .arrow:before { top: 0; border-width: .4rem .4rem 0; border-top-color: #000 } .bs-tooltip-auto[x-placement^=right], .bs-tooltip-right { padding: 0 .4rem } .bs-tooltip-auto[x-placement^=right] .arrow, .bs-tooltip-right .arrow { left: 0; width: .4rem; height: .8rem } .bs-tooltip-auto[x-placement^=right] .arrow:before, .bs-tooltip-right .arrow:before { right: 0; border-width: .4rem .4rem .4rem 0; border-right-color: #000 } .bs-tooltip-auto[x-placement^=bottom], .bs-tooltip-bottom { padding: .4rem 0 } .bs-tooltip-auto[x-placement^=bottom] .arrow, .bs-tooltip-bottom .arrow { top: 0 } .bs-tooltip-auto[x-placement^=bottom] .arrow:before, .bs-tooltip-bottom .arrow:before { bottom: 0; border-width: 0 .4rem .4rem; border-bottom-color: #000 } .bs-tooltip-auto[x-placement^=left], .bs-tooltip-left { padding: 0 .4rem } .bs-tooltip-auto[x-placement^=left] .arrow, .bs-tooltip-left .arrow { right: 0; width: .4rem; height: .8rem } .bs-tooltip-auto[x-placement^=left] .arrow:before, .bs-tooltip-left .arrow:before { left: 0; border-width: .4rem 0 .4rem .4rem; border-left-color: #000 } .tooltip-inner { max-width: 200px; padding: .25rem .5rem; color: #fff; text-align: center; background-color: #000; border-radius: .25rem } .nav { display: flex; flex-wrap: wrap; padding-right: 0; margin-bottom: 0; list-style: none } .nav-link { display: block; padding: 1px 1rem } .nav-link:focus, .nav-link:hover { text-decoration: none } .foot.disabled, .nav-link.disabled { color: #6c757d; pointer-events: none; cursor: default } .nav-tabs { border-bottom: 1px solid #dee2e6 } .nav-tabs .nav-item { margin-bottom: -1px } .nav-tabs .nav-link { border: 1px solid transparent; border-top-right-radius: .25rem; border-top-left-radius: .25rem } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: #e9ecef #e9ecef #dee2e6 } .nav-tabs .nav-link.active { color: #495057; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff } .tab-content>.tab-pane { display: none } .tab-content>.active { display: block } .navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: .5rem 0 } .navbar-brand { display: inline-block; padding-top: .3125rem; padding-bottom: .3125rem; margin-left: 1rem; font-size: 1.25rem; line-height: inherit; white-space: nowrap } .navbar-brand:focus, .navbar-brand:hover { text-decoration: none } .navbar-nav { display: flex; flex-direction: column; padding-right: 0; margin-bottom: 0; list-style: none } .navbar-nav .nav-link { padding-left: 0; padding-right: 0; width: -moz-max-content; width: max-content } .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center } .navbar-toggler { padding: .25rem .75rem; font-size: 1.25rem; line-height: 1; background-color: transparent; border: 1px solid transparent; border-radius: .25rem; margin-right: auto } .navbar-toggler:focus, .navbar-toggler:hover { text-decoration: none } .navbar-toggler:not(:disabled):not(.disabled) { cursor: pointer } @media (min-width:992px) { .navbar-expand-lg { flex-flow: row nowrap } .navbar-expand-lg .navbar-nav { flex-direction: row } .navbar-expand-lg .navbar-nav .nav-link { padding-left: .5rem; padding-right: .5rem } .navbar-expand-lg .navbar-collapse { display: -ms-flexbox !important; display: -webkit-box !important; display: contents !important; flex-basis: auto } .navbar-expand-lg .navbar-toggler { display: none } } .navbar-light .navbar-brand, .navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { color: rgba(0, 0, 0, .9) } .navbar-light .navbar-nav .nav-link { color: rgba(0, 0, 0, .5) } .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: rgba(0, 0, 0, .7) } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, .3) } .navbar-light .navbar-nav .active>.nav-link { color: rgba(0, 0, 0, .9) } .navbar-light .navbar-toggler { color: rgba(0, 0, 0, .5); border-color: rgba(0, 0, 0, .1) } .page-link:not(:disabled):not(.disabled) { cursor: pointer } .close { float: left; font-size: 1.5rem; font-weight: 700; color: #000; text-shadow: 0 1px 0 #fff; opacity: .5 } .close:hover { color: #000; text-decoration: none } .close:not(:disabled):not(.disabled) { cursor: pointer } .close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover { opacity: .75 } button.close { padding: 0; background-color: transparent; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none } .modal-open { overflow: hidden } .modal-open .modal { overflow-x: hidden; overflow-y: auto } .modal { position: fixed; top: 0; right: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0 } .modal-dialog { position: relative; width: auto; margin: 3.5rem .5rem; pointer-events: none } .modal-dialog table { border-spacing: .7rem } .modal.fade .modal-dialog { transition: transform .3s ease-out; transform: translateY(-50px) } @media screen and (prefers-reduced-motion:reduce) { .modal.fade .modal-dialog { transition: none } } .modal.show .modal-dialog { transform: none } .modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - (.5rem * 2)) } .modal-dialog-centered:before { display: block; height: calc(100vh - (.5rem * 2)); content: "" } .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); border-radius: .3rem; outline: 0 } .modal-backdrop { position: fixed; top: 0; right: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000 } .modal-backdrop.fade { opacity: 0 } .modal-backdrop.show { opacity: .5 } .modal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: .5rem; color: #fff; border-radius: 45px; background-color: #007a82; width: 300px; font-size: 20px; margin: -25px auto auto } .modal-title { font-size: 24px } .modal-content .nav-link { font-size: 18px } .modal-header .close { padding: 1rem; margin: -1rem 0 -1rem -1rem; position: absolute } .modal-content .tab-pane { font-size: 16px } .modal-title { margin-bottom: 0; line-height: 1.5 } .modal-body { position: relative; flex: 1 1 auto; padding: 1rem } .modal-footer { display: flex; align-items: center; justify-content: flex-end; padding: 1rem; border-top: 1px solid #e9ecef; border-bottom-left-radius: .3rem; border-bottom-right-radius: .3rem } .modal-footer>button { font-size: 18px; color: #b8b8b8; background-color: #ebebeb; border-radius: 15px; padding: 5px 30px } .modal-footer>button:hover { background-color: #007a82; color: #fff } .modal-footer>:not(:first-child) { margin-right: .25rem } .modal-footer>:not(:last-child) { margin-left: .25rem } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll } @media (min-width:576px) { .modal-dialog { max-width: 530px; margin: 3.75rem auto } .modal-dialog-centered { min-height: calc(100% - (1.75rem * 2)) } .modal-dialog-centered:before { height: calc(100vh - (1.75rem * 2)) } .modal-sm { max-width: 300px } } @media (min-width:992px) { .modal-lg, .modal-xl { max-width: 800px } } @media (min-width:1200px) { .modal-xl { max-width: 1140px } } .clearfix:after { display: block; clear: both; content: "" } .d-inline { display: inline !important } .d-block { display: block !important } .d-flex { display: flex !important } .justify-content-end { justify-content: flex-end !important } .justify-content-center { justify-content: center !important } .justify-content-between { justify-content: space-between !important } .float-left { float: right !important } .float-right { float: left !important } .mt-4 { margin-top: 1.5rem !important } .mx-auto { margin-left: auto !important } .text-right { text-align: left !important } .text-left { text-align: right !important } .text-center { text-align: center !important } @media print { *, :after, :before { text-shadow: none !important; box-shadow: none !important } a:not(.btn) { text-decoration: underline } img { page-break-inside: avoid } h2, h3, p { orphans: 3; widows: 3 } h2, h3 { page-break-after: avoid } @page { size: a3 } .container, body { min-width: 992px !important } .navbar { display: none } } .clr-black { color: #000 !important } .txt-Error { color: var(--red) } .clr-blue { color: #007a82 } .clr-orange { color: #ec8865 } .clr-pink { color: #f91b61 } .clr-green { color: #5b9e4f } .clr-brown { color: #ab7c74 } .clr-black-light { color: #9c9c9c !important } .clr-purple { color: #6f5de3 } .btn { border: 0 solid transparent; font-family: Noto Kufi Arabic, sans-serif } .btn-color-grey { color: #444; background-color: rgba(0, 0, 0, .04); border-radius: 3px } .btn-color-grey:active, .btn-color-grey:hover { background-color: rgba(0, 0, 0, .08) } .btn-color-green { color: #2ec38a; background: #f2fbf7; border: 1px solid rgba(46, 195, 138, .5); border-radius: 3px } .btn-color-green:active, .btn-color-green:hover { color: #008351; background: #caeede } .btn-color-orange-dark { background-image: linear-gradient(-135deg, #f1cc48, #ff7169); border-radius: 3px; color: #fff } .btn-color-purple { color: #6754e2; background: #f6f5fd; border: 1px solid rgba(103, 84, 226, .5); border-radius: 3px } .btn-color-purple:active, .btn-color-purple:hover { color: #1e00e4; background: #ddd8ff } .btn-color-pink { color: #f91c60; background: #fef2f6; border: 1px solid rgba(249, 28, 96, .5); border-radius: 3px } .btn-color-pink:active, .btn-color-pink:hover { color: #f2004b; background: #facedd } .sound-right { margin-right: 10px } .examples .example .sm2_button { display: none } .text-end { text-align: end } .english { font-family: Roboto, sans-serif !important; text-transform: capitalize } .sm2_button:focus, .sm2_button:hover { opacity: .5 } .show-in-mobile { display: none } .qtsQ { font-family: Noto Kufi Arabic, sans-serif; font-size: 2.5rem } .qts { font-family: serif !important; font-size: 21px; line-height: 25px } .qts-resource { font-size: 16px; padding-right: 12px; display: none } .breakePos { vertical-align: text-top !important } .subtitle { margin: 9px 0; padding: 10px } h6 { margin: 0 } .modal-body p, .modal-body ul li { font-size: 18px; margin-bottom: 4px } .modal-body img { margin-right: auto; margin-left: auto; display: block; max-width: 100%; height: auto } #Blogmodal .modal-body img { border: none; display: inline; padding-bottom: 10px; max-width: 40px } #BlogDescriptionModel .tab-content { overflow-y: auto; height: 397px } .close { line-height: 1; color: #fff; text-shadow: none } .auto-complete { position: absolute; background-color: #fff; width: 98%; color: #444; box-shadow: -3px 6px 13px 0 rgba(3, 27, 72, .05); z-index: 10; margin-right: 2%; border-radius: 27px; overflow: hidden } .auto-complete option { padding: 10px !important; display: block !important; font-size: 1.5rem; cursor: pointer !important } .auto-complete option:hover { background-color: #f6f9fd; border-right: 2.5px solid #ec8865 } .home-page { background: url(./imgs/hero-bg.png) no-repeat; position: relative; background-size: cover; background-position: bottom } .page-caption { margin: 30px auto } .page-title { font-size: 46px; line-height: 1; color: #fff; font-weight: 400; text-align: center; margin-bottom: 28px } .custom-search { width: 411px; margin: 0 auto } .custom-search .MuiAutocomplete-endAdornment { display: none } .custom-search .MuiInputLabel-formControl[data-shrink=true] { color: transparent } .custom-search .MuiInputLabel-formControl { left: auto; right: 8px; top: -10px; font-size: 16px } .custom-search label+.MuiInput-formControl { margin-top: 0 } .MuiAutocomplete-noOptions, .MuiAutocomplete-option, .MuiAutocomplete-paper, .MuiAutocomplete-popper, .MuiFormLabel-root, .MuiInputLabel-formControl { font-family: Noto Kufi Arabic, sans-serif !important } .custom-search .MuiFormLabel-root.Mui-focused { display: none } .custom-search .MuiAutocomplete-inputRoot .MuiAutocomplete-input { font-family: Noto Kufi Arabic, sans-serif; padding: 0 !important } .custom-search .MuiAutocomplete-hasPopupIcon.MuiAutocomplete-hasClearIcon .MuiAutocomplete-inputRoot { padding-right: 0; margin-top: 0; padding-bottom: 0 } .custom-search .MuiInput-underline:after, .custom-search .MuiInput-underline:before, .custom-search .MuiInput-underline:hover:not(.Mui-disabled):before { border-bottom: none !important } .custom-search .form-group { margin: 0 } .custom-search img.search-icon { width: 20px; margin: 10px 15px 10px 0; opacity: .5; height: 20px } .custom-search input { border: 0; height: 40px; margin: auto 7px auto auto; font-weight: 500; font-size: 16px; border-radius: 0 3px 3px 0; transition: .3s } .custom-search input[type=submit] { font-size: 22px; border: 0; padding: 0 5px; height: 100%; width: 100%; border-radius: 30px; margin-left: -1px } .custom-search .icon-search, .custom-search input[type=submit] { transition: all .3s ease-in-out; color: #fff; cursor: pointer; outline: 0; background-color: #02a4ac } .custom-search .icon-search { font-weight: 600; font-size: 40px; border: 0; height: 60px; position: relative; z-index: 99 } .custom-search .icon-search:hover { background-color: #006971 !important; transform: scale(1.03) } .search-letters { color: #fff; margin-bottom: 40px } .search-letters ul { list-style: none; color: #fff; display: flex } .search-letters ul li { margin: 0 2px 10px; background: linear-gradient(1deg, #07a8ad, transparent); height: 30px; width: 30px; text-align: center; cursor: pointer; opacity: .8; transition: ease-in-out; border-radius: 8px } .search-letters ul li:hover { opacity: 1; border: 1px solid #01a4ac } .custom-search input[type=submit]:hover { background-image: linear-gradient(-90deg, #006971, #006971) } .navbar-light .navbar-nav .nav-item { font-size: 1.1rem } .home-page .navbar-light .navbar-nav .active>.nav-link { color: #fff } .home-page .navbar-light .navbar-nav { padding: 2px 12px; background: rgba(53, 247, 255, .17); border-radius: 12px; border: .5px solid hsla(0, 0%, 90%, .45); opacity: .9 } .home-page .navbar-light .navbar-nav .nav-link { color: hsla(0, 0%, 100%, .9); font-size: 16px } .home-page .navbar-light .navbar-nav .nav-link.disabled { color: hsla(0, 0%, 100%, .5) } .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link { color: #444 } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, .4) } .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { color: #02a4ac } .navbar-light .navbar-toggler { color: transparent; border-color: unset } .header-inside .sub-menu { background-size: cover; background-image: url(./imgs/hero-bg.png); background-position: 50% } .header-inside .sub-menu h1 { color: #fff; margin: 12px 0 0; padding: 0; line-height: 1; font-size: 2.3rem; font-weight: 700 } .btn-green-outline { color: #9ecba6; border: 1px solid #bae277; padding: 3px 28px } .btn-green-outline:hover { background: -webkit-gradient(-90deg, #f5ef7d, #7fd570); background: linear-gradient(-90deg, #f5ef7d, #7fd570); background-image: linear-gradient(-90deg, #f5ef7d, #7fd570) } .btn-green-fill { color: #fff; background: linear-gradient(-90deg, #f5ef7d, #7fd570); padding: 3px 28px } .cards-list-example { padding: 26px; max-width: 100% } .list-card-list { background: #fff; box-shadow: 2px 2px 11px #58585829, -2px 0 6px #58585829; border: 1px solid #ededed; border-radius: 15px; padding: 26px } .list-card-list ul { list-style-type: none; padding: 5px; text-align: center } .cards-list-example .list-card-list ul li { font-size: 1.7rem; color: #007a82; display: inline-block; background: #eff3f69e; margin: 16px; text-align: center; padding: 20px 10px; min-width: 62px; cursor: pointer; border-radius: 20px; border: .5px solid transparent } .cards-list-example .list-card-list ul li:hover, .list-card-list ul li:active { color: #006a71; border-color: #006971 } .cards-list-example .list-card-list .english-word { direction: ltr } .more-button { margin-top: 10px } .latest-word { background-color: #fff; padding: 40px } .latest-word p { margin-top: 18px; font-size: 17px; font-weight: 800 } .most-search { background: #f5faf7; border-radius: 8px; padding: 26px; margin-top: 22px } .most-search ul { list-style-type: none; margin: 16px 0 0; padding: 0 } .latest-word .most-search ul li { display: inline-block; background: #ededed; border-radius: 3px; font-size: 18px; color: #555; padding: 0 18px; margin: 10px 0 0 8px } .most-search ul li:active { background: #daeee2 } .words-detail .most-search ul li { display: inline-block; border-radius: 3px; font-size: 20px; color: #555; margin: 10px 0 0 8px } .information { padding: 26px; max-width: 100vw } .information .list-card-list { padding: 18px 18px 10px; margin-bottom: 20px } .information .list-card-list input, .information .list-card-list textarea, .modal.show .modal-dialog .form-control { height: auto; margin-bottom: 20px; background-color: #f4f4f4; font-size: 16px; border: .5px solid #707070; border-radius: 8px } .information .list-card-list p { margin: 40px 40px 40px 5px; font-weight: 700; line-height: 27px } .information .list-card-list .more-button { margin-top: 0 } .header-inside .list-filter { margin: 20px 0; padding: 10px 0; border: 1px solid #ededed; border-radius: 10px; background-color: #fff } .header-inside .list-filter ul { list-style-type: none; flex-wrap: wrap; margin: 0; padding: 0 } .header-inside .list-filter ul li { display: inline-block; padding: 0 5px; font-size: 1.7rem; font-weight: 700 } .header-inside .list-filter .navbar { padding: unset } .words-list { padding: 26px } .words-list ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between } .words-list .list li { float: right; width: 18%; margin: 1rem 0 } .words-list .list li a:active, .words-list .list li a:hover { background: #007a82; color: #fff !important } .words-list .list li img { margin-top: 11px } .words-list .list li>img:hover { filter: invert(7%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%) } .words-list .list li a { color: #02a4ac; font-size: 25px; padding: 10px 0; display: block; border-radius: 25px; position: relative; background-color: #f1f1f1; border: 1px solid #d6d6d6; box-shadow: -3px 6px 13px 0 rgba(3, 27, 72, .05); text-align: center } .word-analytics h1 { font-size: 26px; margin: 6px 8px } .word-analytics #words { padding: 0 15px; border-radius: 5px; margin-bottom: 10px } .word-analytics #words .search-word { font-size: 16px; display: inline-block; padding: 5px; margin: 0 } .word-analytics #words .similar-word { font-size: 18px; display: inline-block; padding: 5px; margin: 0; border: 1px solid #007a82 } .word-analytics #words .similar-word.active { background-color: #007a82 } .word-analytics .list-card-list { padding: 10px 12px } .word-analytics .words-similar { font-size: 18px; padding-top: 6px } .tab-labels { background-color: #eef3f7 !important } .nav-tabs .nav-link.active { border-color: #fff } .nav-tabs { border-bottom: 1px solid #fff } .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { border-color: #eef3f7 } .nav-tabs .nav-link { border: 0 solid transparent } .nav-tabs .nav-link.active { color: #2e4f87; font-weight: 600 } .tab-pane { overflow-y: auto; padding: 10px; max-height: 700px; font-size: 20px; text-align: justify } .words-detail .examples ul { border-bottom: 2px solid #f3f3f3 } .words-detail .english { font-size: 15px; padding: 0 6px } .words-detail ol li { margin-top: 20px } .words-detail span.part-english { display: inline-block } .words-detail ol li .buttons-more { margin: 20px 0 } .words-detail ol li .buttons-more button.btn { margin: 6px 0 } .inline-img { display: inline !important } .justify3 { text-align: JUSTIFY (3) } .center { text-align: center } .aboutus { margin: 26px 0; text-align: justify } .aboutus h2 { font-size: 2.1rem !important; color: #02a4ac } .aboutus h3 { font-size: 1.8rem; color: #007a82 } .aboutus h4 { font-size: 1.7rem; color: #02a4ac } .aboutus h5 { color: #008351 } .aboutus h6 { font-size: 1.4rem; color: #117a8b } .aboutus strong h6 { font-size: 1.4rem; color: #b68a08 } .aboutus, .aboutus li, .aboutus p { font-size: 1.1rem } .aboutus ul { display: block; margin-right: 22px; list-style: disc; text-align: right } .error { margin: 12px 0; padding: 10% } .error img { margin-bottom: 18px } .aboutus img { margin: 16px auto; display: block; padding: .25rem; background-color: #fff; border: 1px solid #dee2e6; border-radius: .25rem; max-width: 100%; height: auto } .list-card-list ul li:active { color: unset; border: none } .table { width: 100%; margin-bottom: 1rem; background-color: transparent } .table td, .table th { padding: .25rem; vertical-align: top; border-top: 1px solid #dee2e6 } .table thead th { vertical-align: bottom; border-bottom: 2px solid #dee2e6 } .table tbody+tbody { border-top: 2px solid #dee2e6 } .table .table { background-color: #fff } .table-sm td, .table-sm th { padding: .3rem } .table-bordered { border: 1px solid #dee2e6 } .table-bordered td, .table-bordered th { border: 1px solid #dee2e6 !important } .table-borderless tbody+tbody, .table-borderless td, .table-borderless th, .table-borderless thead th { border: 0 } .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, .05) } .table-hover tbody tr:hover { background-color: rgba(0, 0, 0, .075) } .table-primary, .table-primary>td, .table-primary>th { background-color: #b8daff } .table-primary tbody+tbody, .table-primary td, .table-primary th, .table-primary thead th { border-color: #7abaff } .table-hover .table-primary:hover, .table-hover .table-primary:hover>td, .table-hover .table-primary:hover>th { background-color: #9fcdff } .table-secondary, .table-secondary>td, .table-secondary>th { background-color: #d6d8db } .table-secondary tbody+tbody, .table-secondary td, .table-secondary th, .table-secondary thead th { border-color: #b3b7bb } .table-hover .table-secondary:hover, .table-hover .table-secondary:hover>td, .table-hover .table-secondary:hover>th { background-color: #c8cbcf } .table-success, .table-success>td, .table-success>th { background-color: #c3e6cb } .table-success tbody+tbody, .table-success td, .table-success th, .table-success thead th { border-color: #8fd19e } .table-hover .table-success:hover, .table-hover .table-success:hover>td, .table-hover .table-success:hover>th { background-color: #b1dfbb } .table-info, .table-info>td, .table-info>th { background-color: #bee5eb } .table-info tbody+tbody, .table-info td, .table-info th, .table-info thead th { border-color: #86cfda } .table-hover .table-info:hover, .table-hover .table-info:hover>td, .table-hover .table-info:hover>th { background-color: #abdde5 } .table-warning, .table-warning>td, .table-warning>th { background-color: #ffeeba } .table-warning tbody+tbody, .table-warning td, .table-warning th, .table-warning thead th { border-color: #ffdf7e } .table-hover .table-warning:hover, .table-hover .table-warning:hover>td, .table-hover .table-warning:hover>th { background-color: #ffe8a1 } .table-danger, .table-danger>td, .table-danger>th { background-color: #f5c6cb } .table-danger tbody+tbody, .table-danger td, .table-danger th, .table-danger thead th { border-color: #ed969e } .table-hover .table-danger:hover, .table-hover .table-danger:hover>td, .table-hover .table-danger:hover>th { background-color: #f1b0b7 } .table-light, .table-light>td, .table-light>th { background-color: #fdfdfe } .table-light tbody+tbody, .table-light td, .table-light th, .table-light thead th { border-color: #fbfcfc } .table-hover .table-light:hover, .table-hover .table-light:hover>td, .table-hover .table-light:hover>th { background-color: #ececf6 } .table-dark, .table-dark>td, .table-dark>th { background-color: #c6c8ca } .table-dark tbody+tbody, .table-dark td, .table-dark th, .table-dark thead th { border-color: #95999c } .table-hover .table-dark:hover, .table-hover .table-dark:hover>td, .table-hover .table-dark:hover>th { background-color: #b9bbbe } .table-active, .table-active>td, .table-active>th, .table-hover .table-active:hover, .table-hover .table-active:hover>td, .table-hover .table-active:hover>th { background-color: rgba(0, 0, 0, .075) } .table .thead-dark th { color: #fff; background-color: #212529; border-color: #32383e } .table .thead-light th { color: #495057; background-color: #e9ecef; border-color: #dee2e6 } .table-dark { color: #fff; background-color: #212529 } .table-dark td, .table-dark th, .table-dark thead th { border-color: #32383e } .table-dark.table-bordered { border: 0 } .table-dark.table-striped tbody tr:nth-of-type(odd) { background-color: hsla(0, 0%, 100%, .05) } .table-dark.table-hover tbody tr:hover { background-color: hsla(0, 0%, 100%, .075) } .more-words { -moz-column-width: 115px; column-width: 115px; grid-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px } @media (max-width:575.98px) { .list-card-list { padding-left: 15px; padding-right: 15px } .information { padding: 10px } .table-responsive-sm { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar } .table-responsive-sm>.table-bordered { border: 0 } } @media (max-width:767.98px) { .fs-160 { font-size: 3.5rem !important } .part-english a { font-size: 12px !important; line-height: 13px !important } .justitfy-content-end-res { justify-content: end !important } .more { font-size: 2.5rem; background-color: #007a82; border-radius: 40px; margin: 8rem auto 4rem !important; padding: 8px 40px; width: 70% !important } .cards-list-example .list-card-list ul li { margin: 12px; padding: 15px 13px; min-width: 55px; font-weight: 700 } html { font-size: 12px !important } .table-responsive-md { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar } .table-responsive-md>.table-bordered { border: 0 } } .fs-70 { font-size: 5.5rem !important } .fs-160 { font-size: 8rem !important } .fs-50 { font-size: 4rem !important } @media (max-width:991.98px) { .modal-footer>button { padding: .2rem 4rem !important } header .auto-complete { display: none !important } .fs-70 { font-size: 4rem !important } .fs-160 { font-size: 5rem !important } .fs-50 { font-size: 3rem !important } .p-8 { padding: 2.5rem !important } .table-responsive-lg { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar } .table-responsive-lg>.table-bordered { border: 0 } .hide-xs { display: none } .home-nav { width: 100% !important } .custom-search { width: 300px } .search-letters ul { display: flex; flex-wrap: wrap; padding: 0 } .home-page { background-position: 50% } .icon-sections-hover .list-card-list { padding: 15px 20px } .shapeBg img { height: 45px; width: auto; margin: 0 !important } .numbers .number { margin: 0 10px 50px !important } footer>.row { justify-content: center } footer>.row p { margin-bottom: 20px !important } .word-analytics #words { margin-bottom: 15px } } @media (max-width:1199.98px) { .table-responsive-xl { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar } .table-responsive-xl>.table-bordered { border: 0 } nav .navbar-brand { width: 100px; margin-left: 2px !important } .hide-md { display: none } .custom-search { width: 400px } .search-letters ul { display: flex; flex-wrap: wrap; padding: 0 } .shapeBg img { height: 70px; width: auto; margin: 0 !important } } .table-responsive { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar } .table-responsive>.table-bordered { border: 0 } .popover { top: 0; left: 0; z-index: 1060; max-width: 276px; font-family: Noto Kufi Arabic, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; text-align: right; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; letter-spacing: normal; word-break: normal; word-spacing: normal; white-space: normal; line-break: auto; font-size: .875rem; word-wrap: break-word; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, .2); border-radius: .3rem } .popover, .popover .arrow { position: absolute; display: block } .popover .arrow { width: 1rem; height: .5rem; margin: 0 .3rem } .popover .arrow:after, .popover .arrow:before { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid } .bs-popover-auto[x-placement^=top], .bs-popover-top { margin-bottom: .5rem } .bs-popover-auto[x-placement^=top] .arrow, .bs-popover-top .arrow { bottom: calc((.5rem + 1px) * -1) } .bs-popover-auto[x-placement^=top] .arrow:after, .bs-popover-auto[x-placement^=top] .arrow:before, .bs-popover-top .arrow:after, .bs-popover-top .arrow:before { border-width: .5rem .5rem 0 } .bs-popover-auto[x-placement^=top] .arrow:before, .bs-popover-top .arrow:before { bottom: 0; border-top-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=top] .arrow:after, .bs-popover-top .arrow:after { bottom: 1px; border-top-color: #fff } .bs-popover-auto[x-placement^=right], .bs-popover-right { margin-left: .5rem } .bs-popover-auto[x-placement^=right] .arrow, .bs-popover-right .arrow { left: calc((.5rem + 1px) * -1); width: .5rem; height: 1rem; margin: .3rem 0 } .bs-popover-auto[x-placement^=right] .arrow:after, .bs-popover-auto[x-placement^=right] .arrow:before, .bs-popover-right .arrow:after, .bs-popover-right .arrow:before { border-width: .5rem .5rem .5rem 0 } .bs-popover-auto[x-placement^=right] .arrow:before, .bs-popover-right .arrow:before { left: 0; border-right-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=right] .arrow:after, .bs-popover-right .arrow:after { left: 1px; border-right-color: #fff } .bs-popover-auto[x-placement^=bottom], .bs-popover-bottom { margin-top: .5rem } .bs-popover-auto[x-placement^=bottom] .arrow, .bs-popover-bottom .arrow { top: calc((.5rem + 1px) * -1) } .bs-popover-auto[x-placement^=bottom] .arrow:after, .bs-popover-auto[x-placement^=bottom] .arrow:before, .bs-popover-bottom .arrow:after, .bs-popover-bottom .arrow:before { border-width: 0 .5rem .5rem } .bs-popover-auto[x-placement^=bottom] .arrow:before, .bs-popover-bottom .arrow:before { top: 0; border-bottom-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=bottom] .arrow:after, .bs-popover-bottom .arrow:after { top: 1px; border-bottom-color: #fff } .bs-popover-auto[x-placement^=bottom] .popover-header:before, .bs-popover-bottom .popover-header:before { position: absolute; top: 0; right: 50%; display: block; width: 1rem; margin-right: -.5rem; content: ""; border-bottom: 1px solid #f7f7f7 } .bs-popover-auto[x-placement^=left], .bs-popover-left { margin-right: .5rem } .bs-popover-auto[x-placement^=left] .arrow, .bs-popover-left .arrow { right: calc((.5rem + 1px) * -1); width: .5rem; height: 1rem; margin: .3rem 0 } .bs-popover-auto[x-placement^=left] .arrow:after, .bs-popover-auto[x-placement^=left] .arrow:before, .bs-popover-left .arrow:after, .bs-popover-left .arrow:before { border-width: .5rem 0 .5rem .5rem } .bs-popover-auto[x-placement^=left] .arrow:before, .bs-popover-left .arrow:before { right: 0; border-left-color: rgba(0, 0, 0, .25) } .bs-popover-auto[x-placement^=left] .arrow:after, .bs-popover-left .arrow:after { right: 1px; border-left-color: #fff } .popover-header { padding: .5rem .75rem; margin-bottom: 0; font-size: 1rem; background-color: #2e4f87; color: #fff !important; border-bottom: 1px solid #ebebeb; border-top-right-radius: calc(.3rem - 1px); border-top-left-radius: calc(.3rem - 1px) } .popover-header:empty { display: none } .popover-header img { filter: invert(7%) sepia(26%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%) } .popover img { margin-bottom: 0 !important; background-color: transparent !important; border: none !important } .popover-body { padding: .5rem .75rem; color: #212529 } @media (max-width:575.98px) { .popover { max-width: 180px } .hide-xs { display: none } .home-nav { width: 100% !important } .custom-search { width: 300px } .search-letters ul { display: flex; flex-wrap: wrap; padding: 0 } .home-page { background-position: 50% } .icon-sections-hover .list-card-list { padding: 15px 20px } .shapeBg img { height: 45px; width: auto; margin: 0 !important } .header-inside .list-filter { text-align: center } .header-inside .list-filter h1 { margin-bottom: 10px } .header-inside .list-filter .nav-actions-btn { justify-content: space-evenly } #uList .page-link { padding: 15px } .word-analytics #words { margin-bottom: 15px } } @media (max-width:767.98px) { .popover { max-width: 180px } .hide-xs { display: none } .home-nav { width: 100% !important } .custom-search { width: 300px } .search-letters ul { display: flex; flex-wrap: wrap; padding: 0 } .home-page { background-position: 50% } .icon-sections-hover .list-card-list { padding: 15px 20px } .shapeBg img { height: 45px; width: auto; margin: 0 !important } .header-inside .list-filter { text-align: center } .header-inside .list-filter h1 { margin-bottom: 10px } .header-inside .list-filter .nav-actions-btn { justify-content: space-evenly } #uList .page-link { padding: 15px } .word-analytics #words { margin-bottom: 15px } } @media (max-width:320px) { .popover { max-width: 140px } } .w-25 { width: 25% !important } .w-50 { width: 50% !important } .w-75 { width: 75% !important } .w-100 { width: 100% !important } .w-auto { width: auto !important } .h-25 { height: 25% !important } .h-50 { height: 50% !important } .h-75 { height: 75% !important } .h-100 { height: 100% !important } .h-auto { height: auto !important } .mw-100 { max-width: 100% !important } .mh-100 { max-height: 100% !important } .min-vw-100 { min-width: 100vw !important } .min-vh-100 { min-height: 100vh !important } .vw-100 { width: 100vw !important } .vh-100 { height: 100vh !important } .m-0 { margin: 0 !important } .mt-0, .my-0 { margin-top: 0 !important } .mr-0, .mx-0 { margin-left: 0 !important } .mb-0, .my-0 { margin-bottom: 0 !important } .ml-0, .mx-0 { margin-right: 0 !important } .m-1 { margin: .25rem !important } .mt-1, .my-1 { margin-top: .25rem !important } .mr-1, .mx-1 { margin-left: .25rem !important } .mb-1, .my-1 { margin-bottom: .25rem !important } .ml-1, .mx-1 { margin-right: .25rem !important } .m-2 { margin: .5rem !important } .mt-2, .my-2 { margin-top: .5rem !important } .mr-2, .mx-2 { margin-left: .5rem !important } .mb-2, .my-2 { margin-bottom: .5rem !important } .ml-2, .mx-2 { margin-right: .5rem !important } .m-3 { margin: 1rem !important } .mt-3, .my-3 { margin-top: 1rem !important } .mr-3, .mx-3 { margin-left: 1rem !important } .mb-3, .my-3 { margin-bottom: 1rem !important } .ml-3, .mx-3 { margin-right: 1rem !important } .m-4 { margin: 1.5rem !important } .mt-4, .my-4 { margin-top: 1.5rem !important } .mr-4, .mx-4 { margin-left: 1.5rem !important } .mb-4, .my-4 { margin-bottom: 1.5rem !important } .ml-4, .mx-4 { margin-right: 1.5rem !important } .m-5 { margin: 3rem !important } .mt-5, .my-5 { margin-top: 3rem !important } .mr-5, .mx-5 { margin-left: 3rem !important } .mb-5, .my-5 { margin-bottom: 3rem !important } .ml-5, .mx-5 { margin-right: 3rem !important } .p-0 { padding: 0 !important } .pt-0, .py-0 { padding-top: 0 !important } .pr-0, .px-0 { padding-left: 0 !important } .pb-0, .py-0 { padding-bottom: 0 !important } .pl-0, .px-0 { padding-right: 0 !important } .p-1 { padding: .25rem !important } .pt-1, .py-1 { padding-top: .25rem !important } .pr-1, .px-1 { padding-left: .25rem !important } .pb-1, .py-1 { padding-bottom: .25rem !important } .pl-1, .px-1 { padding-right: .25rem !important } .p-2 { padding: .5rem !important } .pt-2, .py-2 { padding-top: .5rem !important } .pr-2, .px-2 { padding-left: .5rem !important } .pb-2, .py-2 { padding-bottom: .5rem !important } .pl-2, .px-2 { padding-right: .5rem !important } .p-3 { padding: 1rem !important } .pt-3, .py-3 { padding-top: 1rem !important } .pr-3, .px-3 { padding-left: 1rem !important } .pb-3, .py-3 { padding-bottom: 1rem !important } .pl-3, .px-3 { padding-right: 1rem !important } .p-4 { padding: 2.3rem !important } .pt-4, .py-4 { padding-top: 2.3rem !important } .pr-4, .px-4 { padding-left: 2.3rem !important } .pb-4, .py-4 { padding-bottom: 2.3rem !important } .pl-4, .px-4 { padding-right: 2.3rem !important } .p-5 { padding: 3rem !important } .pt-5, .py-5 { padding-top: 3rem !important } .pr-5, .px-5 { padding-left: 3rem !important } .pb-5, .py-5 { padding-bottom: 3rem !important } .pl-5, .px-5 { padding-right: 3rem !important } .m-n1 { margin: -.25rem !important } .mt-n1, .my-n1 { margin-top: -.25rem !important } .mr-n1, .mx-n1 { margin-left: -.25rem !important } .mb-n1, .my-n1 { margin-bottom: -.25rem !important } .ml-n1, .mx-n1 { margin-right: -.25rem !important } .m-n2 { margin: -.5rem !important } .mt-n2, .my-n2 { margin-top: -.5rem !important } .mr-n2, .mx-n2 { margin-left: -.5rem !important } .mb-n2, .my-n2 { margin-bottom: -.5rem !important } .ml-n2, .mx-n2 { margin-right: -.5rem !important } .m-n3 { margin: -1rem !important } .mt-n3, .my-n3 { margin-top: -1rem !important } .mr-n3, .mx-n3 { margin-left: -1rem !important } .mb-n3, .my-n3 { margin-bottom: -1rem !important } .ml-n3, .mx-n3 { margin-right: -1rem !important } .m-n4 { margin: -1.5rem !important } .mt-n4, .my-n4 { margin-top: -1.5rem !important } .mr-n4, .mx-n4 { margin-left: -1.5rem !important } .mb-n4, .my-n4 { margin-bottom: -1.5rem !important } .ml-n4, .mx-n4 { margin-right: -1.5rem !important } .m-n5 { margin: -3rem !important } .mt-n5, .my-n5 { margin-top: -3rem !important } .mr-n5, .mx-n5 { margin-left: -3rem !important } .mb-n5, .my-n5 { margin-bottom: -3rem !important } .ml-n5, .mx-n5 { margin-right: -3rem !important } .m-auto { margin: auto !important } .mt-auto, .my-auto { margin-top: auto !important } .mr-auto, .mx-auto { margin-left: auto !important } .mb-auto, .my-auto { margin-bottom: auto !important } .ml-auto, .mx-auto { margin-right: auto !important } @media (min-width:576px) { .m-sm-0 { margin: 0 !important } .mt-sm-0, .my-sm-0 { margin-top: 0 !important } .mr-sm-0, .mx-sm-0 { margin-left: 0 !important } .mb-sm-0, .my-sm-0 { margin-bottom: 0 !important } .ml-sm-0, .mx-sm-0 { margin-right: 0 !important } .m-sm-1 { margin: .25rem !important } .mt-sm-1, .my-sm-1 { margin-top: .25rem !important } .mr-sm-1, .mx-sm-1 { margin-left: .25rem !important } .mb-sm-1, .my-sm-1 { margin-bottom: .25rem !important } .ml-sm-1, .mx-sm-1 { margin-right: .25rem !important } .m-sm-2 { margin: .5rem !important } .mt-sm-2, .my-sm-2 { margin-top: .5rem !important } .mr-sm-2, .mx-sm-2 { margin-left: .5rem !important } .mb-sm-2, .my-sm-2 { margin-bottom: .5rem !important } .ml-sm-2, .mx-sm-2 { margin-right: .5rem !important } .m-sm-3 { margin: 1rem !important } .mt-sm-3, .my-sm-3 { margin-top: 1rem !important } .mr-sm-3, .mx-sm-3 { margin-left: 1rem !important } .mb-sm-3, .my-sm-3 { margin-bottom: 1rem !important } .ml-sm-3, .mx-sm-3 { margin-right: 1rem !important } .m-sm-4 { margin: 1.5rem !important } .mt-sm-4, .my-sm-4 { margin-top: 1.5rem !important } .mr-sm-4, .mx-sm-4 { margin-left: 1.5rem !important } .mb-sm-4, .my-sm-4 { margin-bottom: 1.5rem !important } .ml-sm-4, .mx-sm-4 { margin-right: 1.5rem !important } .m-sm-5 { margin: 3rem !important } .mt-sm-5, .my-sm-5 { margin-top: 3rem !important } .mr-sm-5, .mx-sm-5 { margin-left: 3rem !important } .mb-sm-5, .my-sm-5 { margin-bottom: 3rem !important } .ml-sm-5, .mx-sm-5 { margin-right: 3rem !important } .p-sm-0 { padding: 0 !important } .pt-sm-0, .py-sm-0 { padding-top: 0 !important } .pr-sm-0, .px-sm-0 { padding-left: 0 !important } .pb-sm-0, .py-sm-0 { padding-bottom: 0 !important } .pl-sm-0, .px-sm-0 { padding-right: 0 !important } .p-sm-1 { padding: .25rem !important } .pt-sm-1, .py-sm-1 { padding-top: .25rem !important } .pr-sm-1, .px-sm-1 { padding-left: .25rem !important } .pb-sm-1, .py-sm-1 { padding-bottom: .25rem !important } .pl-sm-1, .px-sm-1 { padding-right: .25rem !important } .p-sm-2 { padding: .5rem !important } .pt-sm-2, .py-sm-2 { padding-top: .5rem !important } .pr-sm-2, .px-sm-2 { padding-left: .5rem !important } .pb-sm-2, .py-sm-2 { padding-bottom: .5rem !important } .pl-sm-2, .px-sm-2 { padding-right: .5rem !important } .p-sm-3 { padding: 1rem !important } .pt-sm-3, .py-sm-3 { padding-top: 1rem !important } .pr-sm-3, .px-sm-3 { padding-left: 1rem !important } .pb-sm-3, .py-sm-3 { padding-bottom: 1rem !important } .pl-sm-3, .px-sm-3 { padding-right: 1rem !important } .p-sm-4 { padding: 1.5rem !important } .pt-sm-4, .py-sm-4 { padding-top: 1.5rem !important } .pr-sm-4, .px-sm-4 { padding-left: 1.5rem !important } .pb-sm-4, .py-sm-4 { padding-bottom: 1.5rem !important } .pl-sm-4, .px-sm-4 { padding-right: 1.5rem !important } .p-sm-5 { padding: 3rem !important } .pt-sm-5, .py-sm-5 { padding-top: 3rem !important } .pr-sm-5, .px-sm-5 { padding-left: 3rem !important } .pb-sm-5, .py-sm-5 { padding-bottom: 3rem !important } .pl-sm-5, .px-sm-5 { padding-right: 3rem !important } .m-sm-n1 { margin: -.25rem !important } .mt-sm-n1, .my-sm-n1 { margin-top: -.25rem !important } .mr-sm-n1, .mx-sm-n1 { margin-left: -.25rem !important } .mb-sm-n1, .my-sm-n1 { margin-bottom: -.25rem !important } .ml-sm-n1, .mx-sm-n1 { margin-right: -.25rem !important } .m-sm-n2 { margin: -.5rem !important } .mt-sm-n2, .my-sm-n2 { margin-top: -.5rem !important } .mr-sm-n2, .mx-sm-n2 { margin-left: -.5rem !important } .mb-sm-n2, .my-sm-n2 { margin-bottom: -.5rem !important } .ml-sm-n2, .mx-sm-n2 { margin-right: -.5rem !important } .m-sm-n3 { margin: -1rem !important } .mt-sm-n3, .my-sm-n3 { margin-top: -1rem !important } .mr-sm-n3, .mx-sm-n3 { margin-left: -1rem !important } .mb-sm-n3, .my-sm-n3 { margin-bottom: -1rem !important } .ml-sm-n3, .mx-sm-n3 { margin-right: -1rem !important } .m-sm-n4 { margin: -1.5rem !important } .mt-sm-n4, .my-sm-n4 { margin-top: -1.5rem !important } .mr-sm-n4, .mx-sm-n4 { margin-left: -1.5rem !important } .mb-sm-n4, .my-sm-n4 { margin-bottom: -1.5rem !important } .ml-sm-n4, .mx-sm-n4 { margin-right: -1.5rem !important } .m-sm-n5 { margin: -3rem !important } .mt-sm-n5, .my-sm-n5 { margin-top: -3rem !important } .mr-sm-n5, .mx-sm-n5 { margin-left: -3rem !important } .mb-sm-n5, .my-sm-n5 { margin-bottom: -3rem !important } .ml-sm-n5, .mx-sm-n5 { margin-right: -3rem !important } .m-sm-auto { margin: auto !important } .mt-sm-auto, .my-sm-auto { margin-top: auto !important } .mr-sm-auto, .mx-sm-auto { margin-left: auto !important } .mb-sm-auto, .my-sm-auto { margin-bottom: auto !important } .ml-sm-auto, .mx-sm-auto { margin-right: auto !important } } @media (min-width:768px) { .text-md-start { text-align: start !important } .m-md-0 { margin: 0 !important } .mt-md-0, .my-md-0 { margin-top: 0 !important } .mr-md-0, .mx-md-0 { margin-left: 0 !important } .mb-md-0, .my-md-0 { margin-bottom: 0 !important } .ml-md-0, .mx-md-0 { margin-right: 0 !important } .m-md-1 { margin: .25rem !important } .mt-md-1, .my-md-1 { margin-top: .25rem !important } .mr-md-1, .mx-md-1 { margin-left: .25rem !important } .mb-md-1, .my-md-1 { margin-bottom: .25rem !important } .ml-md-1, .mx-md-1 { margin-right: .25rem !important } .m-md-2 { margin: .5rem !important } .mt-md-2, .my-md-2 { margin-top: .5rem !important } .mr-md-2, .mx-md-2 { margin-left: .5rem !important } .mb-md-2, .my-md-2 { margin-bottom: .5rem !important } .ml-md-2, .mx-md-2 { margin-right: .5rem !important } .m-md-3 { margin: 1rem !important } .mt-md-3, .my-md-3 { margin-top: 1rem !important } .mr-md-3, .mx-md-3 { margin-left: 1rem !important } .mb-md-3, .my-md-3 { margin-bottom: 1rem !important } .ml-md-3, .mx-md-3 { margin-right: 1rem !important } .m-md-4 { margin: 1.5rem !important } .mt-md-4, .my-md-4 { margin-top: 1.5rem !important } .mr-md-4, .mx-md-4 { margin-left: 1.5rem !important } .mb-md-4, .my-md-4 { margin-bottom: 1.5rem !important } .ml-md-4, .mx-md-4 { margin-right: 1.5rem !important } .m-md-5 { margin: 3rem !important } .mt-md-5, .my-md-5 { margin-top: 3rem !important } .mr-md-5, .mx-md-5 { margin-left: 3rem !important } .mb-md-5, .my-md-5 { margin-bottom: 3rem !important } .ml-md-5, .mx-md-5 { margin-right: 3rem !important } .p-md-0 { padding: 0 !important } .pt-md-0, .py-md-0 { padding-top: 0 !important } .pr-md-0, .px-md-0 { padding-left: 0 !important } .pb-md-0, .py-md-0 { padding-bottom: 0 !important } .pl-md-0, .px-md-0 { padding-right: 0 !important } .p-md-1 { padding: .25rem !important } .pt-md-1, .py-md-1 { padding-top: .25rem !important } .pr-md-1, .px-md-1 { padding-left: .25rem !important } .pb-md-1, .py-md-1 { padding-bottom: .25rem !important } .pl-md-1, .px-md-1 { padding-right: .25rem !important } .p-md-2 { padding: .5rem !important } .pt-md-2, .py-md-2 { padding-top: .5rem !important } .pr-md-2, .px-md-2 { padding-left: .5rem !important } .pb-md-2, .py-md-2 { padding-bottom: .5rem !important } .pl-md-2, .px-md-2 { padding-right: .5rem !important } .p-md-3 { padding: 1rem !important } .pt-md-3, .py-md-3 { padding-top: 1rem !important } .pr-md-3, .px-md-3 { padding-left: 1rem !important } .pb-md-3, .py-md-3 { padding-bottom: 1rem !important } .pl-md-3, .px-md-3 { padding-right: 1rem !important } .p-md-4 { padding: 1.5rem !important } .pt-md-4, .py-md-4 { padding-top: 1.5rem !important } .pr-md-4, .px-md-4 { padding-left: 1.5rem !important } .pb-md-4, .py-md-4 { padding-bottom: 1.5rem !important } .pl-md-4, .px-md-4 { padding-right: 1.5rem !important } .p-md-5 { padding: 3rem !important } .pt-md-5, .py-md-5 { padding-top: 3rem !important } .pr-md-5, .px-md-5 { padding-left: 3rem !important } .pb-md-5, .py-md-5 { padding-bottom: 3rem !important } .pl-md-5, .px-md-5 { padding-right: 3rem !important } .m-md-n1 { margin: -.25rem !important } .mt-md-n1, .my-md-n1 { margin-top: -.25rem !important } .mr-md-n1, .mx-md-n1 { margin-left: -.25rem !important } .mb-md-n1, .my-md-n1 { margin-bottom: -.25rem !important } .ml-md-n1, .mx-md-n1 { margin-right: -.25rem !important } .m-md-n2 { margin: -.5rem !important } .mt-md-n2, .my-md-n2 { margin-top: -.5rem !important } .mr-md-n2, .mx-md-n2 { margin-left: -.5rem !important } .mb-md-n2, .my-md-n2 { margin-bottom: -.5rem !important } .ml-md-n2, .mx-md-n2 { margin-right: -.5rem !important } .m-md-n3 { margin: -1rem !important } .mt-md-n3, .my-md-n3 { margin-top: -1rem !important } .mr-md-n3, .mx-md-n3 { margin-left: -1rem !important } .mb-md-n3, .my-md-n3 { margin-bottom: -1rem !important } .ml-md-n3, .mx-md-n3 { margin-right: -1rem !important } .m-md-n4 { margin: -1.5rem !important } .mt-md-n4, .my-md-n4 { margin-top: -1.5rem !important } .mr-md-n4, .mx-md-n4 { margin-left: -1.5rem !important } .mb-md-n4, .my-md-n4 { margin-bottom: -1.5rem !important } .ml-md-n4, .mx-md-n4 { margin-right: -1.5rem !important } .m-md-n5 { margin: -3rem !important } .mt-md-n5, .my-md-n5 { margin-top: -3rem !important } .mr-md-n5, .mx-md-n5 { margin-left: -3rem !important } .mb-md-n5, .my-md-n5 { margin-bottom: -3rem !important } .ml-md-n5, .mx-md-n5 { margin-right: -3rem !important } .m-md-auto { margin: auto !important } .mt-md-auto, .my-md-auto { margin-top: auto !important } .mr-md-auto, .mx-md-auto { margin-left: auto !important } .mb-md-auto, .my-md-auto { margin-bottom: auto !important } .ml-md-auto, .mx-md-auto { margin-right: auto !important } } @media (min-width:992px) { .text-md-end { text-align: end !important } .m-lg-0 { margin: 0 !important } .mt-lg-0, .my-lg-0 { margin-top: 0 !important } .mr-lg-0, .mx-lg-0 { margin-left: 0 !important } .mb-lg-0, .my-lg-0 { margin-bottom: 0 !important } .ml-lg-0, .mx-lg-0 { margin-right: 0 !important } .m-lg-1 { margin: .25rem !important } .mt-lg-1, .my-lg-1 { margin-top: .25rem !important } .mr-lg-1, .mx-lg-1 { margin-left: .25rem !important } .mb-lg-1, .my-lg-1 { margin-bottom: .25rem !important } .ml-lg-1, .mx-lg-1 { margin-right: .25rem !important } .m-lg-2 { margin: .5rem !important } .mt-lg-2, .my-lg-2 { margin-top: .5rem !important } .mr-lg-2, .mx-lg-2 { margin-left: .5rem !important } .mb-lg-2, .my-lg-2 { margin-bottom: .5rem !important } .ml-lg-2, .mx-lg-2 { margin-right: .5rem !important } .m-lg-3 { margin: 1rem !important } .mt-lg-3, .my-lg-3 { margin-top: 1rem !important } .mr-lg-3, .mx-lg-3 { margin-left: 1rem !important } .mb-lg-3, .my-lg-3 { margin-bottom: 1rem !important } .ml-lg-3, .mx-lg-3 { margin-right: 1rem !important } .m-lg-4 { margin: 1.5rem !important } .mt-lg-4, .my-lg-4 { margin-top: 1.5rem !important } .mr-lg-4, .mx-lg-4 { margin-left: 1.5rem !important } .mb-lg-4, .my-lg-4 { margin-bottom: 1.5rem !important } .ml-lg-4, .mx-lg-4 { margin-right: 1.5rem !important } .m-lg-5 { margin: 3rem !important } .mt-lg-5, .my-lg-5 { margin-top: 3rem !important } .mr-lg-5, .mx-lg-5 { margin-left: 3rem !important } .mb-lg-5, .my-lg-5 { margin-bottom: 3rem !important } .ml-lg-5, .mx-lg-5 { margin-right: 3rem !important } .p-lg-0 { padding: 0 !important } .pt-lg-0, .py-lg-0 { padding-top: 0 !important } .pr-lg-0, .px-lg-0 { padding-left: 0 !important } .pb-lg-0, .py-lg-0 { padding-bottom: 0 !important } .pl-lg-0, .px-lg-0 { padding-right: 0 !important } .p-lg-1 { padding: .25rem !important } .pt-lg-1, .py-lg-1 { padding-top: .25rem !important } .pr-lg-1, .px-lg-1 { padding-left: .25rem !important } .pb-lg-1, .py-lg-1 { padding-bottom: .25rem !important } .pl-lg-1, .px-lg-1 { padding-right: .25rem !important } .p-lg-2 { padding: .5rem !important } .pt-lg-2, .py-lg-2 { padding-top: .5rem !important } .pr-lg-2, .px-lg-2 { padding-left: .5rem !important } .pb-lg-2, .py-lg-2 { padding-bottom: .5rem !important } .pl-lg-2, .px-lg-2 { padding-right: .5rem !important } .p-lg-3 { padding: 1rem !important } .pt-lg-3, .py-lg-3 { padding-top: 1rem !important } .pr-lg-3, .px-lg-3 { padding-left: 1rem !important } .pb-lg-3, .py-lg-3 { padding-bottom: 1rem !important } .pl-lg-3, .px-lg-3 { padding-right: 1rem !important } .p-lg-4 { padding: 1.5rem !important } .pt-lg-4, .py-lg-4 { padding-top: 1.5rem !important } .pr-lg-4, .px-lg-4 { padding-left: 1.5rem !important } .pb-lg-4, .py-lg-4 { padding-bottom: 1.5rem !important } .pl-lg-4, .px-lg-4 { padding-right: 1.5rem !important } .p-lg-5 { padding: 3rem !important } .pt-lg-5, .py-lg-5 { padding-top: 3rem !important } .pr-lg-5, .px-lg-5 { padding-left: 3rem !important } .pb-lg-5, .py-lg-5 { padding-bottom: 3rem !important } .pl-lg-5, .px-lg-5 { padding-right: 3rem !important } .m-lg-n1 { margin: -.25rem !important } .mt-lg-n1, .my-lg-n1 { margin-top: -.25rem !important } .mr-lg-n1, .mx-lg-n1 { margin-left: -.25rem !important } .mb-lg-n1, .my-lg-n1 { margin-bottom: -.25rem !important } .ml-lg-n1, .mx-lg-n1 { margin-right: -.25rem !important } .m-lg-n2 { margin: -.5rem !important } .mt-lg-n2, .my-lg-n2 { margin-top: -.5rem !important } .mr-lg-n2, .mx-lg-n2 { margin-left: -.5rem !important } .mb-lg-n2, .my-lg-n2 { margin-bottom: -.5rem !important } .ml-lg-n2, .mx-lg-n2 { margin-right: -.5rem !important } .m-lg-n3 { margin: -1rem !important } .mt-lg-n3, .my-lg-n3 { margin-top: -1rem !important } .mr-lg-n3, .mx-lg-n3 { margin-left: -1rem !important } .mb-lg-n3, .my-lg-n3 { margin-bottom: -1rem !important } .ml-lg-n3, .mx-lg-n3 { margin-right: -1rem !important } .m-lg-n4 { margin: -1.5rem !important } .mt-lg-n4, .my-lg-n4 { margin-top: -1.5rem !important } .mr-lg-n4, .mx-lg-n4 { margin-left: -1.5rem !important } .mb-lg-n4, .my-lg-n4 { margin-bottom: -1.5rem !important } .ml-lg-n4, .mx-lg-n4 { margin-right: -1.5rem !important } .m-lg-n5 { margin: -3rem !important } .mt-lg-n5, .my-lg-n5 { margin-top: -3rem !important } .mr-lg-n5, .mx-lg-n5 { margin-left: -3rem !important } .mb-lg-n5, .my-lg-n5 { margin-bottom: -3rem !important } .ml-lg-n5, .mx-lg-n5 { margin-right: -3rem !important } .m-lg-auto { margin: auto !important } .mt-lg-auto, .my-lg-auto { margin-top: auto !important } .mr-lg-auto, .mx-lg-auto { margin-left: auto !important } .mb-lg-auto, .my-lg-auto { margin-bottom: auto !important } .ml-lg-auto, .mx-lg-auto { margin-right: auto !important } } @media (min-width:1200px) { html { font-size: 14px !important } .m-xl-0 { margin: 0 !important } .mt-xl-0, .my-xl-0 { margin-top: 0 !important } .mr-xl-0, .mx-xl-0 { margin-left: 0 !important } .mb-xl-0, .my-xl-0 { margin-bottom: 0 !important } .ml-xl-0, .mx-xl-0 { margin-right: 0 !important } .m-xl-1 { margin: .25rem !important } .mt-xl-1, .my-xl-1 { margin-top: .25rem !important } .mr-xl-1, .mx-xl-1 { margin-left: .25rem !important } .mb-xl-1, .my-xl-1 { margin-bottom: .25rem !important } .ml-xl-1, .mx-xl-1 { margin-right: .25rem !important } .m-xl-2 { margin: .5rem !important } .mt-xl-2, .my-xl-2 { margin-top: .5rem !important } .mr-xl-2, .mx-xl-2 { margin-left: .5rem !important } .mb-xl-2, .my-xl-2 { margin-bottom: .5rem !important } .ml-xl-2, .mx-xl-2 { margin-right: .5rem !important } .m-xl-3 { margin: 1rem !important } .mt-xl-3, .my-xl-3 { margin-top: 1rem !important } .mr-xl-3, .mx-xl-3 { margin-left: 1rem !important } .mb-xl-3, .my-xl-3 { margin-bottom: 1rem !important } .ml-xl-3, .mx-xl-3 { margin-right: 1rem !important } .m-xl-4 { margin: 1.5rem !important } .mt-xl-4, .my-xl-4 { margin-top: 1.5rem !important } .mr-xl-4, .mx-xl-4 { margin-left: 1.5rem !important } .mb-xl-4, .my-xl-4 { margin-bottom: 1.5rem !important } .ml-xl-4, .mx-xl-4 { margin-right: 1.5rem !important } .m-xl-5 { margin: 3rem !important } .mt-xl-5, .my-xl-5 { margin-top: 3rem !important } .mr-xl-5, .mx-xl-5 { margin-left: 3rem !important } .mb-xl-5, .my-xl-5 { margin-bottom: 3rem !important } .ml-xl-5, .mx-xl-5 { margin-right: 3rem !important } .p-xl-0 { padding: 0 !important } .pt-xl-0, .py-xl-0 { padding-top: 0 !important } .pr-xl-0, .px-xl-0 { padding-left: 0 !important } .pb-xl-0, .py-xl-0 { padding-bottom: 0 !important } .pl-xl-0, .px-xl-0 { padding-right: 0 !important } .p-xl-1 { padding: .25rem !important } .pt-xl-1, .py-xl-1 { padding-top: .25rem !important } .pr-xl-1, .px-xl-1 { padding-left: .25rem !important } .pb-xl-1, .py-xl-1 { padding-bottom: .25rem !important } .pl-xl-1, .px-xl-1 { padding-right: .25rem !important } .p-xl-2 { padding: .5rem !important } .pt-xl-2, .py-xl-2 { padding-top: .5rem !important } .pr-xl-2, .px-xl-2 { padding-left: .5rem !important } .pb-xl-2, .py-xl-2 { padding-bottom: .5rem !important } .pl-xl-2, .px-xl-2 { padding-right: .5rem !important } .p-xl-3 { padding: 1rem !important } .pt-xl-3, .py-xl-3 { padding-top: 1rem !important } .pr-xl-3, .px-xl-3 { padding-left: 1rem !important } .pb-xl-3, .py-xl-3 { padding-bottom: 1rem !important } .pl-xl-3, .px-xl-3 { padding-right: 1rem !important } .p-xl-4 { padding: 1.5rem !important } .pt-xl-4, .py-xl-4 { padding-top: 1.5rem !important } .pr-xl-4, .px-xl-4 { padding-left: 1.5rem !important } .pb-xl-4, .py-xl-4 { padding-bottom: 1.5rem !important } .pl-xl-4, .px-xl-4 { padding-right: 1.5rem !important } .p-xl-5 { padding: 3rem !important } .pt-xl-5, .py-xl-5 { padding-top: 3rem !important } .pr-xl-5, .px-xl-5 { padding-left: 3rem !important } .pb-xl-5, .py-xl-5 { padding-bottom: 3rem !important } .pl-xl-5, .px-xl-5 { padding-right: 3rem !important } .m-xl-n1 { margin: -.25rem !important } .mt-xl-n1, .my-xl-n1 { margin-top: -.25rem !important } .mr-xl-n1, .mx-xl-n1 { margin-left: -.25rem !important } .mb-xl-n1, .my-xl-n1 { margin-bottom: -.25rem !important } .ml-xl-n1, .mx-xl-n1 { margin-right: -.25rem !important } .m-xl-n2 { margin: -.5rem !important } .mt-xl-n2, .my-xl-n2 { margin-top: -.5rem !important } .mr-xl-n2, .mx-xl-n2 { margin-left: -.5rem !important } .mb-xl-n2, .my-xl-n2 { margin-bottom: -.5rem !important } .ml-xl-n2, .mx-xl-n2 { margin-right: -.5rem !important } .m-xl-n3 { margin: -1rem !important } .mt-xl-n3, .my-xl-n3 { margin-top: -1rem !important } .mr-xl-n3, .mx-xl-n3 { margin-left: -1rem !important } .mb-xl-n3, .my-xl-n3 { margin-bottom: -1rem !important } .ml-xl-n3, .mx-xl-n3 { margin-right: -1rem !important } .m-xl-n4 { margin: -1.5rem !important } .mt-xl-n4, .my-xl-n4 { margin-top: -1.5rem !important } .mr-xl-n4, .mx-xl-n4 { margin-left: -1.5rem !important } .mb-xl-n4, .my-xl-n4 { margin-bottom: -1.5rem !important } .ml-xl-n4, .mx-xl-n4 { margin-right: -1.5rem !important } .m-xl-n5 { margin: -3rem !important } .mt-xl-n5, .my-xl-n5 { margin-top: -3rem !important } .mr-xl-n5, .mx-xl-n5 { margin-left: -3rem !important } .mb-xl-n5, .my-xl-n5 { margin-bottom: -3rem !important } .ml-xl-n5, .mx-xl-n5 { margin-right: -3rem !important } .m-xl-auto { margin: auto !important } .mt-xl-auto, .my-xl-auto { margin-top: auto !important } .mr-xl-auto, .mx-xl-auto { margin-left: auto !important } .mb-xl-auto, .my-xl-auto { margin-bottom: auto !important } .ml-xl-auto, .mx-xl-auto { margin-right: auto !important } } @media (max-width:1024px), screen and (max-width:1112px) { .ex-label-hadith, .ex-label-noraml, .ex-label-quran { display: block !important } .navbar-light .navbar-nav .nav-item { padding-left: 0 } } @media screen and (max-width:576px), screen and (max-width:768px) { .mw-25 { max-width: 45px !important } .navlink { border-radius: 20px !important; padding: .5rem !important; margin-left: .8rem !important; font-size: 1.5rem !important; margin-bottom: 0 !important } .more-words>li { margin: .5rem 1rem !important } footer img { max-width: 30px } .item:before { top: 1% !important; left: -107px !important } .pl-80 { margin-left: 20px !important } footer>div { padding: 20px !important; justify-content: center !important } .page-title { font-size: 36px } .custom-search input { border-radius: 3px } .custom-search input[type=submit] { border-radius: 30px } .custom-search .icon-search { margin: 10px 0 0; border-radius: 3px } .page-caption { padding-bottom: 30px; padding-top: 15px; max-width: 95% } .responsive-light { text-align: center } .responsive-black { text-align: center; background-color: #f6f9fd } .show-in-web { display: none } .show-in-mobile { display: unset } .cards-list-example .list-card-list { margin-bottom: 10px } .latest-word .words { border-right: unset } .latest-word .line { border-bottom: 1px solid rgba(0, 0, 0, .1); padding-top: 18px } .latest-word .line:last-child { border-bottom: unset } .latest-word ul li { margin: 0 0 10px 8px } .header-inside .sub-menu h1 { margin: 8px 0 0; font-size: 1.5rem } .words-list .list li { width: 45% } .word-analytics .advance-search button { margin-top: 3px } .words-detail ol li .buttons-more { margin: 20px 0 60px } .xs-hidden { display: none } } @media (min-width:768px) { .custom-search input { border-radius: 0 3px 3px 0 } .custom-search input[type=submit] { margin: 0; border-radius: 30px } .latest-word .line { border-right: 1px solid rgba(0, 0, 0, .1) } } .BlogLink { color: #2e4f87 } .BImg { border: none; width: 24px } [hidden] { display: none !important } .false-word { color: var(--red) } .Sakkal { font-family: Noto Kufi Arabic, sans-serif } .words-detail { margin-bottom: 25px } .LOgoST { position: absolute; right: 8px; top: 27px; width: 150px } .like:hover { background-color: var(--green) !important; fill: #fff !important } .dislike:hover { background-color: red !important; fill: #fff !important } .mR-70 { margin-right: 70px } .position-relative { position: relative } .MailResult { margin-left: 2px; color: #000 } .handCutsor { cursor: pointer !important } .handCutsor:hover { opacity: .9; transform: scale(1.02) } .table70 { width: 70%; margin: auto } .table40 { width: 40%; margin: auto } .hide-autocomplete { display: none } .pt50 { padding-top: 50px } .hidden { display: none } .mh300 { max-height: 300px } .MuiTooltip-tooltip { font-size: .875rem !important; font-family: Noto Kufi Arabic, sans-serif } .p-d25 { padding-bottom: 25px } .lfWmUL { width: -moz-min-content; width: min-content; display: inline-flex } .lfWmUL .layout { background-color: inherit !important; color: #222b45; font-family: Noto Kufi Arabic, sans-serif; font-size: .9375rem; font-weight: 400; line-height: inherit !important; min-height: inherit !important; text-align: right !important; width: -moz-min-content !important; width: min-content !important; min-width: 0 !important; min-width: auto !important; cursor: pointer } .jRerCN { margin-bottom: 0 !important } .navlink.active { color: #d8b6ac } .navlink { color: #537071; background: #fff; border: 1px solid #d9d9d9; border-bottom: none; box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .06); border-radius: 30px; margin-left: 1rem; font-weight: 700; font-size: 2rem; margin-bottom: -2rem; padding: 1rem 2.5rem 2rem; margin-top: 2rem; display: block } .w-6 { width: 1.5rem } .h-6 { height: 1.5rem } .w-100vw { width: 100vw } .bg-main { background-color: #006971 !important } .bg-white { background-color: #fff !important } .bg-green { background-color: #5b9e4f !important } .bg-blue { background-color: #02a4ac !important } .bg-darckBlue { background-color: #0f5959 } .text-white { color: #fff !important } .bg-silver { background-color: #a2a2a2 !important } footer>div { padding: 50px 0; justify-content: space-between; align-items: baseline } footer { font-size: 16px } footer p a { color: #fff; margin: 0 5px; font-size: 12px } footer .social-icons img { height: 36px } .pl-80 { margin-left: 40px; display: inline-block } .font-bold { font-weight: 700 } .p-8 { padding: 8rem } .rounded-3 { border-radius: 10px !important } .rounded-4 { border-radius: 20px !important } .rounded-5 { border-radius: 30px; overflow: hidden } .text-light { color: #cbcac7 } .text-warning { color: var(--warning) } .text-info { color: var(--info) } .form-control, .form-control:focus, input, input:focus-visible { outline: none; box-shadow: none; border: 0 } .display-2 { font-size: 35px !important } @keyframes up-down { 0%, to { top: 0 } 50% { top: -25px } } .animation { position: relative; animation: up-down 3s linear infinite; margin-bottom: 7rem !important } .shapeBg { background-image: url(./imgs/bg-top-footer.png); background-size: cover } .more-btn { opacity: .8 } .more-btn:hover { opacity: 1; transform: scale(1.1) } .item { overflow: hidden; position: relative } .item:before { position: absolute; color: #fff; font-size: 2.5rem; background-color: #007a82; font-weight: 60; content: "جديد"; padding: 16px 110px; transform: rotate(-45deg); display: block; text-align: center; top: 7%; left: -80px } .contact-rounded { border-radius: 77px } .no-wrap { flex-wrap: nowrap !important } .border-0 { border: 0 !important } .border-1 { border: .5px solid #0f5959 } .bg-light { background-color: #eff3f682 } .items-center { align-items: center } .items-end { align-items: flex-end } footer { background-image: url(./imgs/footerBg.png) !important; background-size: cover; background-position: 50% } footer img { margin-bottom: 10px } #SubHeaderTitle h2 { color: #fff !important; font-size: 2.5rem; margin: 15px 0 } .options-btns { font-size: 1.9rem; border-radius: 15px } .options-btns:hover { color: #fff; background-color: #02a4ac !important } .more-words>li { border: 1px solid #bebebe; border-radius: 5px; box-shadow: 2px 2px 3px #58585829, -2px 0 2px #58585829; font-weight: 900; padding: 5px 15px; font-size: 16px; margin: .6rem 1.5rem; background-color: #f8f8f8 } .d-inline-block, .more-words>li { display: inline-block !important } .fs-20 { font-size: 1.5rem !important } .justify-content-auround { justify-content: space-around } .clr-blue2 { color: #02a4ac !important } .Trad2:before { width: 30%; height: 45vw; min-width: 200px; background-image: url(./imgs/Traditional/sh1.png); top: 0; right: -8rem; z-index: 6; min-height: 400px !important } .Trad2:before, .Trad:after { content: ""; position: absolute; background-size: contain; display: block; background-repeat: no-repeat } .Trad:after { width: 18%; height: 40vw; background-image: url(./imgs/Traditional/sh2.png); top: -3vw; left: -4rem; min-width: 120px !important; min-height: 150px } .tradImg { width: 70%; max-width: 700px; min-width: 250px; margin-top: 3rem } .fs-40 { font-size: 2.7rem !important } .wordBg { position: relative; z-index: 99 } .wordBg .h1 { font-size: 40px } .wordBg .btn-primary, .wordBg .btn-primary:not(:disabled):not(.disabled):active { background-color: transparent; border-color: transparent } .shadow-2 { box-shadow: 0 11px 18px #6a606335 } .ex-label-hadith, .ex-label-noraml, .ex-label-quran, .examplesBg { background-color: #eff3f682 !important; border-radius: 10px; align-items: center; padding: .5rem 1.5rem .5rem 1rem; display: flex; margin: 1.2rem 0; border: 1px solid #e0e0e0; justify-content: space-between } .examples .example { background-color: #f8f8f8 !important; border: 1px solid #f2f0f0; font-size: 16px } .examples .example .qts-resource { font-size: 10px } .examples .example .qts-resource img { width: 20px } button:focus { outline: 0 !important; box-shadow: none !important } .word-effect:hover * { color: #fff !important; background-color: #007a82 !important } .totat-bg { background-image: url(./imgs/total.png); background-position: 0; background-size: contain; background-repeat: no-repeat; height: 140%; top: -20% } .py-7 { padding: 7rem 0 } .toTop { width: 6rem; min-width: 50px !important; position: fixed; bottom: 5%; right: 2%; z-index: 99; cursor: pointer } .toTop img { width: 100% } .filter .one { display: block } .filter .tow, .filter:hover .one { display: none } .filter:hover .tow { display: block } .sticky { position: sticky; top: 0 } .collaps .img-accor { display: none } .collapsO.collapsed { display: block !important } .d-none { display: none } .collapsC.collapsed { display: none !important } .pages-bg { background-image: url(./imgs/pages-bg.svg); background-attachment: fixed; background-size: contain; background-position: 50%; background-repeat: no-repeat } .icon-sections-hover .section-icon { transition: .5s } .icon-sections-hover:hover .section-icon { filter: invert(50%) } .latest-words .flex h3 { box-shadow: 0 7px 17px #99a5a521; border: 1px solid #d6d6d6; border-radius: 10px; font-size: 18px; transition: .3s } .latest-words .flex h3:hover { border: 1px solid #5b9e4f } .latest-words .left-side { opacity: .8 } #today-wrdd { margin-top: -100px } .about-section p, .goals-section p, .sources-section p { font-size: 22px; line-height: 51px } section h3 { font-size: 26px } .numbers { padding: 50px 0 100px; background-image: url(./imgs/bg-numbers.jpg); background-size: cover; background-repeat: no-repeat; background-attachment: fixed; background-position: 88% 100% } .numbers h2 { font-size: 36px; margin-bottom: 70px } .numbers .number { font-size: 45px; color: #fff; font-weight: 700; text-align: center; line-height: 65px; background: hsla(0, 0%, 100%, .33); padding: 15px; border-radius: 14px; margin: 0 5px 50px } .numbers .number h5 { font-size: 24px } .header-inside nav a.nav-link { font-size: 16px } #SubHeaderTitle { font-size: 24px; margin: 4px 17px 0 !important } .nav-actions-btn { justify-content: end; margin-left: 30px } .nav-actions-btn .btn { font-size: 16px; border: 1px solid rgba(0, 0, 0, .157); background: #eff3f6; border-radius: 15px; padding: 5px 25px; transition: .3s; margin: 0 5px } .nav-actions-btn .btn:hover { background: #007a82; color: #fff } .text-sm { font-size: 16px !important } .examplesBg { font-size: 20px } #addComment .modal-header { width: 100% } .applications a { margin: 10px } .applications a img { opacity: .85; transition: .5s; height: 60px } .applications a:hover img { opacity: 1 } .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px } .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { float: left } .col-xs-12 { width: 100% } .col-xs-11 { width: 91.66666667% } .col-xs-10 { width: 83.33333333% } .col-xs-9 { width: 75% } .col-xs-8 { width: 66.66666667% } .col-xs-7 { width: 58.33333333% } .col-xs-6 { width: 50% } .col-xs-5 { width: 41.66666667% } .col-xs-4 { width: 33.33333333% } .col-xs-3 { width: 25% } .col-xs-2 { width: 16.66666667% } .col-xs-1 { width: 8.33333333% } .col-xs-pull-12 { right: 100% } .col-xs-pull-11 { right: 91.66666667% } .col-xs-pull-10 { right: 83.33333333% } .col-xs-pull-9 { right: 75% } .col-xs-pull-8 { right: 66.66666667% } .col-xs-pull-7 { right: 58.33333333% } .col-xs-pull-6 { right: 50% } .col-xs-pull-5 { right: 41.66666667% } .col-xs-pull-4 { right: 33.33333333% } .col-xs-pull-3 { right: 25% } .col-xs-pull-2 { right: 16.66666667% } .col-xs-pull-1 { right: 8.33333333% } .col-xs-pull-0 { right: auto } .col-xs-push-12 { left: 100% } .col-xs-push-11 { left: 91.66666667% } .col-xs-push-10 { left: 83.33333333% } .col-xs-push-9 { left: 75% } .col-xs-push-8 { left: 66.66666667% } .col-xs-push-7 { left: 58.33333333% } .col-xs-push-6 { left: 50% } .col-xs-push-5 { left: 41.66666667% } .col-xs-push-4 { left: 33.33333333% } .col-xs-push-3 { left: 25% } .col-xs-push-2 { left: 16.66666667% } .col-xs-push-1 { left: 8.33333333% } .col-xs-push-0 { left: auto } .col-xs-offset-12 { margin-left: 100% } .col-xs-offset-11 { margin-left: 91.66666667% } .col-xs-offset-10 { margin-left: 83.33333333% } .col-xs-offset-9 { margin-left: 75% } .col-xs-offset-8 { margin-left: 66.66666667% } .col-xs-offset-7 { margin-left: 58.33333333% } .col-xs-offset-6 { margin-left: 50% } .col-xs-offset-5 { margin-left: 41.66666667% } .col-xs-offset-4 { margin-left: 33.33333333% } .col-xs-offset-3 { margin-left: 25% } .col-xs-offset-2 { margin-left: 16.66666667% } .col-xs-offset-1 { margin-left: 8.33333333% } .col-xs-offset-0 { margin-left: 0 } @media (min-width:768px) { .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9 { float: left } .col-sm-12 { width: 100% } .col-sm-11 { width: 91.66666667% } .col-sm-10 { width: 83.33333333% } .col-sm-9 { width: 75% } .col-sm-8 { width: 66.66666667% } .col-sm-7 { width: 58.33333333% } .col-sm-6 { width: 50% } .col-sm-5 { width: 41.66666667% } .col-sm-4 { width: 33.33333333% } .col-sm-3 { width: 25% } .col-sm-2 { width: 16.66666667% } .col-sm-1 { width: 8.33333333% } .col-sm-pull-12 { right: 100% } .col-sm-pull-11 { right: 91.66666667% } .col-sm-pull-10 { right: 83.33333333% } .col-sm-pull-9 { right: 75% } .col-sm-pull-8 { right: 66.66666667% } .col-sm-pull-7 { right: 58.33333333% } .col-sm-pull-6 { right: 50% } .col-sm-pull-5 { right: 41.66666667% } .col-sm-pull-4 { right: 33.33333333% } .col-sm-pull-3 { right: 25% } .col-sm-pull-2 { right: 16.66666667% } .col-sm-pull-1 { right: 8.33333333% } .col-sm-pull-0 { right: auto } .col-sm-push-12 { left: 100% } .col-sm-push-11 { left: 91.66666667% } .col-sm-push-10 { left: 83.33333333% } .col-sm-push-9 { left: 75% } .col-sm-push-8 { left: 66.66666667% } .col-sm-push-7 { left: 58.33333333% } .col-sm-push-6 { left: 50% } .col-sm-push-5 { left: 41.66666667% } .col-sm-push-4 { left: 33.33333333% } .col-sm-push-3 { left: 25% } .col-sm-push-2 { left: 16.66666667% } .col-sm-push-1 { left: 8.33333333% } .col-sm-push-0 { left: auto } .col-sm-offset-12 { margin-left: 100% } .col-sm-offset-11 { margin-left: 91.66666667% } .col-sm-offset-10 { margin-left: 83.33333333% } .col-sm-offset-9 { margin-left: 75% } .col-sm-offset-8 { margin-left: 66.66666667% } .col-sm-offset-7 { margin-left: 58.33333333% } .col-sm-offset-6 { margin-left: 50% } .col-sm-offset-5 { margin-left: 41.66666667% } .col-sm-offset-4 { margin-left: 33.33333333% } .col-sm-offset-3 { margin-left: 25% } .col-sm-offset-2 { margin-left: 16.66666667% } .col-sm-offset-1 { margin-left: 8.33333333% } .col-sm-offset-0 { margin-left: 0 } } @media (min-width:992px) { .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 { float: left } .col-md-12 { width: 100% } .col-md-11 { width: 91.66666667% } .col-md-10 { width: 83.33333333% } .col-md-9 { width: 75% } .col-md-8 { width: 66.66666667% } .col-md-7 { width: 58.33333333% } .col-md-6 { width: 50% } .col-md-5 { width: 41.66666667% } .col-md-4 { width: 33.33333333% } .col-md-3 { width: 25% } .col-md-2 { width: 16.66666667% } .col-md-1 { width: 8.33333333% } .col-md-pull-12 { right: 100% } .col-md-pull-11 { right: 91.66666667% } .col-md-pull-10 { right: 83.33333333% } .col-md-pull-9 { right: 75% } .col-md-pull-8 { right: 66.66666667% } .col-md-pull-7 { right: 58.33333333% } .col-md-pull-6 { right: 50% } .col-md-pull-5 { right: 41.66666667% } .col-md-pull-4 { right: 33.33333333% } .col-md-pull-3 { right: 25% } .col-md-pull-2 { right: 16.66666667% } .col-md-pull-1 { right: 8.33333333% } .col-md-pull-0 { right: auto } .col-md-push-12 { left: 100% } .col-md-push-11 { left: 91.66666667% } .col-md-push-10 { left: 83.33333333% } .col-md-push-9 { left: 75% } .col-md-push-8 { left: 66.66666667% } .col-md-push-7 { left: 58.33333333% } .col-md-push-6 { left: 50% } .col-md-push-5 { left: 41.66666667% } .col-md-push-4 { left: 33.33333333% } .col-md-push-3 { left: 25% } .col-md-push-2 { left: 16.66666667% } .col-md-push-1 { left: 8.33333333% } .col-md-push-0 { left: auto } .col-md-offset-12 { margin-left: 100% } .col-md-offset-11 { margin-left: 91.66666667% } .col-md-offset-10 { margin-left: 83.33333333% } .col-md-offset-9 { margin-left: 75% } .col-md-offset-8 { margin-left: 66.66666667% } .col-md-offset-7 { margin-left: 58.33333333% } .col-md-offset-6 { margin-left: 50% } .col-md-offset-5 { margin-left: 41.66666667% } .col-md-offset-4 { margin-left: 33.33333333% } .col-md-offset-3 { margin-left: 25% } .col-md-offset-2 { margin-left: 16.66666667% } .col-md-offset-1 { margin-left: 8.33333333% } .col-md-offset-0 { margin-left: 0 } } @media (min-width:1200px) { .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9 { float: left } .col-lg-12 { width: 100% } .col-lg-11 { width: 91.66666667% } .col-lg-10 { width: 83.33333333% } .col-lg-9 { width: 75% } .col-lg-8 { width: 66.66666667% } .col-lg-7 { width: 58.33333333% } .col-lg-6 { width: 50% } .col-lg-5 { width: 41.66666667% } .col-lg-4 { width: 33.33333333% } .col-lg-3 { width: 25% } .col-lg-2 { width: 16.66666667% } .col-lg-1 { width: 8.33333333% } .col-lg-pull-12 { right: 100% } .col-lg-pull-11 { right: 91.66666667% } .col-lg-pull-10 { right: 83.33333333% } .col-lg-pull-9 { right: 75% } .col-lg-pull-8 { right: 66.66666667% } .col-lg-pull-7 { right: 58.33333333% } .col-lg-pull-6 { right: 50% } .col-lg-pull-5 { right: 41.66666667% } .col-lg-pull-4 { right: 33.33333333% } .col-lg-pull-3 { right: 25% } .col-lg-pull-2 { right: 16.66666667% } .col-lg-pull-1 { right: 8.33333333% } .col-lg-pull-0 { right: auto } .col-lg-push-12 { left: 100% } .col-lg-push-11 { left: 91.66666667% } .col-lg-push-10 { left: 83.33333333% } .col-lg-push-9 { left: 75% } .col-lg-push-8 { left: 66.66666667% } .col-lg-push-7 { left: 58.33333333% } .col-lg-push-6 { left: 50% } .col-lg-push-5 { left: 41.66666667% } .col-lg-push-4 { left: 33.33333333% } .col-lg-push-3 { left: 25% } .col-lg-push-2 { left: 16.66666667% } .col-lg-push-1 { left: 8.33333333% } .col-lg-push-0 { left: auto } .col-lg-offset-12 { margin-left: 100% } .col-lg-offset-11 { margin-left: 91.66666667% } .col-lg-offset-10 { margin-left: 83.33333333% } .col-lg-offset-9 { margin-left: 75% } .col-lg-offset-8 { margin-left: 66.66666667% } .col-lg-offset-7 { margin-left: 58.33333333% } .col-lg-offset-6 { margin-left: 50% } .col-lg-offset-5 { margin-left: 41.66666667% } .col-lg-offset-4 { margin-left: 33.33333333% } .col-lg-offset-3 { margin-left: 25% } .col-lg-offset-2 { margin-left: 16.66666667% } .col-lg-offset-1 { margin-left: 8.33333333% } .col-lg-offset-0 { margin-left: 0 } } .input-group[class*=col-] { float: none; padding-right: 0; padding-left: 0 } table col[class*=col-] { position: static; display: table-column; float: none } table td[class*=col-], table th[class*=col-] { position: static; display: table-cell; float: none }