Line 1: |
Line 1: |
| {{#css: | | {{#css: |
| + | |
| + | <!-- Styling for the columns --> |
| .row{ | | .row{ |
| display:flex; | | display:flex; |
Line 10: |
Line 12: |
| background-color:#F5F5F5; | | background-color:#F5F5F5; |
| } | | } |
− |
| |
| .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, | | .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, |
| .col-auto, .col-sm-1, .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-sm-10, .col-sm-11, .col-sm-12, .col-sm, | | .col-auto, .col-sm-1, .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-sm-10, .col-sm-11, .col-sm-12, .col-sm, |
Line 23: |
Line 24: |
| padding-left: 15px; | | padding-left: 15px; |
| } | | } |
| + | |
| + | <!-- Mobile UI styling --> |
| @media (max-width: 576px) { | | @media (max-width: 576px) { |
| .col-sm-12 { | | .col-sm-12 { |
Line 28: |
Line 31: |
| max-width: 100%; } | | max-width: 100%; } |
| .section{ | | .section{ |
− | padding: 10px 0 20px 0; | + | padding: 6px 0 20px 0; |
| } | | } |
| .navContainer{ | | .navContainer{ |
Line 34: |
Line 37: |
| } | | } |
| } | | } |
| + | |
| + | <!-- Tablet UI styling --> |
| @media screen and (min-width: 576px) { | | @media screen and (min-width: 576px) { |
| .col-md-6 { | | .col-md-6 { |
Line 43: |
Line 48: |
| max-width: 30%; } | | max-width: 30%; } |
| .section{ | | .section{ |
− | padding: 10px 0 20px 20px; | + | padding: 6px 0 20px 20px; |
| } | | } |
| .col-md-8{ | | .col-md-8{ |
Line 50: |
Line 55: |
| } | | } |
| } | | } |
| + | |
| + | <!-- Desktop UI styling --> |
| @media screen and (min-width: 992px) { | | @media screen and (min-width: 992px) { |
| .col-lg { | | .col-lg { |
Line 71: |
Line 78: |
| } | | } |
| } | | } |
| + | |
| + | <!-- Font styling --> |
| h1,h2{ | | h1,h2{ |
| font-family: 'Helvetica', sans-serif !important; | | font-family: 'Helvetica', sans-serif !important; |
Line 84: |
Line 93: |
| font-weight: 700; | | font-weight: 700; |
| } | | } |
− | .mw-collapsible{
| + | |
− | margin-bottom: 5px;
| + | <!-- Nav Menu Styling --> |
− | }
| |
− | .checkbox{
| |
− | display:inline-block;
| |
− | width: 1rem;
| |
− | height: 1rem !important;
| |
− | border: solid 1px black;
| |
− | margin-right: 10px;
| |
− | }
| |
− | .floatL{
| |
− | float:left;
| |
− | }
| |
| .navMenu{ | | .navMenu{ |
| list-style:none; | | list-style:none; |
Line 106: |
Line 104: |
| background-color: #F5F5F5; | | background-color: #F5F5F5; |
| border-bottom: 5px solid #AF3C43; | | border-bottom: 5px solid #AF3C43; |
− | padding-bottom: 0 !important;
| |
| } | | } |
| .navContainer::-webkit-scrollbar, .tabContainer::-webkit-scrollbar{ | | .navContainer::-webkit-scrollbar, .tabContainer::-webkit-scrollbar{ |
Line 117: |
Line 114: |
| padding-bottom:0px !important; | | padding-bottom:0px !important; |
| } | | } |
− |
| |
| .navMenu li{ | | .navMenu li{ |
| border: solid 1px #002D42; | | border: solid 1px #002D42; |
Line 138: |
Line 134: |
| color: white !important; | | color: white !important; |
| text-decoration:none; | | text-decoration:none; |
− | }
| |
− | .mw-parser-output .external{
| |
− | background:none;
| |
− | padding-right:0;
| |
| } | | } |
| .primary-btn{ | | .primary-btn{ |
Line 159: |
Line 151: |
| color: black !important; | | color: black !important; |
| } | | } |
| + | |
| + | <!-- Checklist styling --> |
| .checklistCont{ | | .checklistCont{ |
| border: 1px solid black; | | border: 1px solid black; |
− | padding: 1.5rem 0 1.5rem 0; | + | margin: 1.5rem 0 1.5rem 0; |
| border-radius: 10px; | | border-radius: 10px; |
| + | } |
| + | .mw-parser-output .external{ |
| + | background:none; |
| + | padding-right:0; |
| + | } |
| + | .mw-collapsible{ |
| + | margin-bottom: 5px; |
| + | } |
| + | .checkbox{ |
| + | display:inline-block; |
| + | width: 1rem; |
| + | height: 1rem !important; |
| + | border: solid 1px black; |
| + | margin-right: 10px; |
| } | | } |
| .card { | | .card { |
Line 176: |
Line 184: |
| flex: 1 1 auto; | | flex: 1 1 auto; |
| padding: 12px; } | | padding: 12px; } |
| + | |
| + | <!-- Back to top Button styling --> |
| .btn-backtotop { | | .btn-backtotop { |
| border: 1px solid #CECECE; | | border: 1px solid #CECECE; |
Line 191: |
Line 201: |
| color: white; | | color: white; |
| text-decoration: none; | | text-decoration: none; |
| + | } |
| + | .fixed{ |
| + | position:fixed; |
| + | bottom:5px; |
| + | right:5px; |
| + | } |
| + | .arrow { |
| + | border: solid black; |
| + | border-width: 0 3px 3px 0; |
| + | display: inline-block; |
| + | padding: 3px; |
| + | } |
| + | .up { |
| + | transform: rotate(-135deg); |
| + | -webkit-transform: rotate(-135deg); |
| } | | } |
| | | |
| + | <!-- More Button styling --> |
| .btn { | | .btn { |
| display: inline-block; | | display: inline-block; |
Line 222: |
Line 248: |
| border-color: #F5F5F5; | | border-color: #F5F5F5; |
| margin-bottom: 12px; | | margin-bottom: 12px; |
− | }
| |
− | .fixed{
| |
− | position:fixed;
| |
− | bottom:5px;
| |
− | right:5px;
| |
− | }
| |
− | .arrow {
| |
− | border: solid black;
| |
− | border-width: 0 3px 3px 0;
| |
− | display: inline-block;
| |
− | padding: 3px;
| |
− | }
| |
− | .up {
| |
− | transform: rotate(-135deg);
| |
− | -webkit-transform: rotate(-135deg);
| |
| } | | } |
| }} | | }} |