Ero sivun ”Järjestelmäviesti:Common.css” versioiden välillä
Häme-Wikistä
pEi muokkausyhteenvetoa |
Ei muokkausyhteenvetoa Merkkaus: Muokkaamalla palautettu |
||
(17 välissä olevaa versiota samalta käyttäjältä ei näytetä) | |||
Rivi 1: | Rivi 1: | ||
/* Tämä sivu sisältää koko sivustoa muuttavia tyylejä. */ | /* Tämä sivu sisältää koko sivustoa muuttavia tyylejä. */ | ||
/*Global*/ | /*Global*/ | ||
.mw-wiki-logo{ display: none; } | .mw-wiki-logo{ display:none; } | ||
.ns-3000 #content, .ns-3000 #content { background-color: #f3f3ff; } | .ns-3000 #content, .ns-3000 #content { background-color: #f3f3ff; } | ||
.ns-3000 div.thumb, .ns-3000 div.thumb { border-color: #f3f3ff; } | .ns-3000 div.thumb, .ns-3000 div.thumb { border-color: #f3f3ff; } | ||
#mw-header #p-logo-text a{ | |||
text-transform:lowercase; | |||
} | |||
#mw-content-container { | #mw-content-container { | ||
min-height: 80vh; | min-height: 80vh; | ||
/*background-color:var(--logo-bg);*/ | |||
border-bottom:0; | |||
} | |||
.mw-footer-container { | |||
color: var(--black); | |||
} | |||
.mw-footer-container a, | |||
.mw-footer-container a:visited{ | |||
color:var(--white); | |||
} | } | ||
/*Etusivu CSS*/ | /*Etusivu CSS*/ | ||
Rivi 20: | Rivi 32: | ||
--blue:#3366cc; | --blue:#3366cc; | ||
--green:#14866d; | --green:#14866d; | ||
--logo-bg:#edeaff; | |||
--fs-h1: 36px; | --fs-h1: 36px; | ||
--fs-h2: 30px; | --fs-h2: 30px; | ||
Rivi 43: | Rivi 56: | ||
.panel{border:1px solid var(--gray);} | .panel{border:1px solid var(--gray);} | ||
.panel .panel-heading{padding:0;} | .panel .panel-heading{padding:0;} | ||
.panel .panel-heading.pad, .h-pad{padding:5px 15px;} | |||
.panel .panel-body{padding:15px;} | .panel .panel-body{padding:15px;} | ||
Rivi 52: | Rivi 66: | ||
.py-4{padding-top:4em;padding-bottom:4em;} | .py-4{padding-top:4em;padding-bottom:4em;} | ||
.pb-1{padding-bottom:1em;} | .pb-1{padding-bottom:1em;} | ||
.mb-1{margin-bottom:1em;} | .mb-1{margin-bottom:1em;} .mb-2{margin-bottom:2em;} .mb-3{margin-bottom:3em;} .mb-4{margin-bottom:4em;} | ||
/*Tasaa rivi columnien korkeudet pienimmillään 767px leveyteen*/ | /*Tasaa rivi columnien korkeudet pienimmillään 767px leveyteen*/ | ||
Rivi 87: | Rivi 101: | ||
@media(max-width:768px){ | @media(max-width:768px){ | ||
.bootstrap-wrapper .thumbnail img{width:100%;} | .bootstrap-wrapper .thumbnail img{width:100%;} | ||
} | |||
/*Mobiili valikko muutokset*/ | |||
@media screen and (max-width: 850px){ | |||
#site-category-tree.sidebar-chunk h2:after, | |||
#site-navigation.sidebar-chunk h2:after { | |||
display: none; | |||
} | |||
#site-category-tree.sidebar-chunk h2 { | |||
right: 50px; | |||
display: inline-block; | |||
content: ''; | |||
width: 30px; | |||
height: 30px; | |||
background-position: center center; | |||
background-image: url(/skins/Timeless/resources/images/gear-large-grey.svg); | |||
background-repeat: no-repeat; | |||
} | |||
/*Tuodaan valikko näkyviin: toimi eri tapaa kuin muut*/ | |||
#site-category-tree.dropdown-active .sidebar-inner { | |||
display: block; | |||
} | |||
} | } | ||
Nykyinen versio 24. huhtikuuta 2023 kello 18.14
/* Tämä sivu sisältää koko sivustoa muuttavia tyylejä. */ /*Global*/ .mw-wiki-logo{ display:none; } .ns-3000 #content, .ns-3000 #content { background-color: #f3f3ff; } .ns-3000 div.thumb, .ns-3000 div.thumb { border-color: #f3f3ff; } #mw-header #p-logo-text a{ text-transform:lowercase; } #mw-content-container { min-height: 80vh; /*background-color:var(--logo-bg);*/ border-bottom:0; } .mw-footer-container { color: var(--black); } .mw-footer-container a, .mw-footer-container a:visited{ color:var(--white); } /*Etusivu CSS*/ :root { --white: #fff; --white-hover: #848484; --black: #000; --black-hover: #383838; --gray:#333; --red:#b32424; --blue:#3366cc; --green:#14866d; --logo-bg:#edeaff; --fs-h1: 36px; --fs-h2: 30px; --fs-h3: 26px; --fs-h4: 22px; --fs-h5: 18px; } body{font-size:16px;} a{color:var(--blue);} a:visited{color:#6018c4;} .c-center{text-align:center;} .c-h1{font-size:var(--fs-h1);} .c-h2{font-size:var(--fs-h2);} .c-h3{font-size:var(--fs-h3);} .c-h4{font-size:var(--fs-h4);} .c-h5{font-size:var(--fs-h5);} .c-bg-red{background-color:var(--red);color:var(--white);} .c-bg-blue{background-color:var(--blue);color:var(--white);} .c-bg-green{background-color:var(--green);color:var(--white);} .c-color-red{color:var(--red);} .c-color-blue{color:var(--blue);} .c-color-green{color:var(--green);} .panel{border:1px solid var(--gray);} .panel .panel-heading{padding:0;} .panel .panel-heading.pad, .h-pad{padding:5px 15px;} .panel .panel-body{padding:15px;} /*Custom paddings*/ .py-1{padding-top:1em;padding-bottom:1em;} .py-2{padding-top:2em;padding-bottom:2em;} .py-3{padding-top:3em;padding-bottom:3em;} .py-4{padding-top:4em;padding-bottom:4em;} .pb-1{padding-bottom:1em;} .mb-1{margin-bottom:1em;} .mb-2{margin-bottom:2em;} .mb-3{margin-bottom:3em;} .mb-4{margin-bottom:4em;} /*Tasaa rivi columnien korkeudet pienimmillään 767px leveyteen*/ @media(min-width:767px){ /*row-qe-height http://jsfiddle.net/gugol/xr5tcwuf/2/*/ .row-eheight { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; flex; } .row-eheight > [class*="col-"] { display: flex; flex-direction: column; } .row-eheight > [class*="col-"] .panel{ height:100%; } } /*Kolmannen nosteen keskittäjä kokoon md-lg*/ @media(min-width:767px) and (max-width:1199px){ .md-lg-margin-auto{ margin-left:auto; margin-right:auto; } } @media(max-width:768px){ .bootstrap-wrapper .thumbnail img{width:100%;} } /*Mobiili valikko muutokset*/ @media screen and (max-width: 850px){ #site-category-tree.sidebar-chunk h2:after, #site-navigation.sidebar-chunk h2:after { display: none; } #site-category-tree.sidebar-chunk h2 { right: 50px; display: inline-block; content: ''; width: 30px; height: 30px; background-position: center center; background-image: url(/skins/Timeless/resources/images/gear-large-grey.svg); background-repeat: no-repeat; } /*Tuodaan valikko näkyviin: toimi eri tapaa kuin muut*/ #site-category-tree.dropdown-active .sidebar-inner { display: block; } } /*! * Bootstrap Grid Only (grid and responsive utilities extracted from Bootstrap 4.1.3) * GitHub: https://github.com/dmhendricks/bootstrap-grid-css * Bootstrap License: MIT (https://github.com/twbs/bootstrap/blob/v4-dev/LICENSE) * Credits: Twitter, Inc. & The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors) */ @-ms-viewport { width: device-width; } html { -webkit-box-sizing: border-box; box-sizing: border-box; -ms-overflow-style: scrollbar; } *, *::before, *::after { -webkit-box-sizing: inherit; box-sizing: inherit; } .bootstrap-wrapper { /** * Bootstrap overrides */ } .bootstrap-wrapper .clearfix::after { display: block; clear: both; content: ""; } .bootstrap-wrapper .visible { visibility: visible !important; } .bootstrap-wrapper .invisible { visibility: hidden !important; } .bootstrap-wrapper .hidden-xs-up { display: none !important; } @media (max-width: 575.98px) { .bootstrap-wrapper .hidden-xs-down { display: none !important; } } @media (min-width: 576px) { .bootstrap-wrapper .hidden-sm-up { display: none !important; } } @media (max-width: 767.98px) { .bootstrap-wrapper .hidden-sm-down { display: none !important; } } @media (min-width: 768px) { .bootstrap-wrapper .hidden-md-up { display: none !important; } } @media (max-width: 991.98px) { .bootstrap-wrapper .hidden-md-down { display: none !important; } } @media (min-width: 992px) { .bootstrap-wrapper .hidden-lg-up { display: none !important; } } @media (max-width: 1199.98px) { .bootstrap-wrapper .hidden-lg-down { display: none !important; } } @media (min-width: 1200px) { .bootstrap-wrapper .hidden-xl-up { display: none !important; } } .bootstrap-wrapper .hidden-xl-down { display: none !important; } .bootstrap-wrapper .visible-print-block { display: none !important; } @media print { .bootstrap-wrapper .visible-print-block { display: block !important; } } .bootstrap-wrapper .visible-print-inline { display: none !important; } @media print { .bootstrap-wrapper .visible-print-inline { display: inline !important; } } .bootstrap-wrapper .visible-print-inline-block { display: none !important; } @media print { .bootstrap-wrapper .visible-print-inline-block { display: inline-block !important; } } @media print { .bootstrap-wrapper .hidden-print { display: none !important; } } .bootstrap-wrapper .container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .bootstrap-wrapper .container { max-width: 540px; } } @media (min-width: 768px) { .bootstrap-wrapper .container { max-width: 720px; } } @media (min-width: 992px) { .bootstrap-wrapper .container { max-width: 960px; } } @media (min-width: 1200px) { .bootstrap-wrapper .container { max-width: 1140px; } } .bootstrap-wrapper .container-fluid { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } .bootstrap-wrapper .row { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .bootstrap-wrapper .no-gutters { margin-right: 0; margin-left: 0; } .bootstrap-wrapper .no-gutters > .col, .bootstrap-wrapper .no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; } .bootstrap-wrapper .col-1, .bootstrap-wrapper .col-2, .bootstrap-wrapper .col-3, .bootstrap-wrapper .col-4, .bootstrap-wrapper .col-5, .bootstrap-wrapper .col-6, .bootstrap-wrapper .col-7, .bootstrap-wrapper .col-8, .bootstrap-wrapper .col-9, .bootstrap-wrapper .col-10, .bootstrap-wrapper .col-11, .bootstrap-wrapper .col-12, .bootstrap-wrapper .col, .bootstrap-wrapper .col-auto, .bootstrap-wrapper .col-sm-1, .bootstrap-wrapper .col-sm-2, .bootstrap-wrapper .col-sm-3, .bootstrap-wrapper .col-sm-4, .bootstrap-wrapper .col-sm-5, .bootstrap-wrapper .col-sm-6, .bootstrap-wrapper .col-sm-7, .bootstrap-wrapper .col-sm-8, .bootstrap-wrapper .col-sm-9, .bootstrap-wrapper .col-sm-10, .bootstrap-wrapper .col-sm-11, .bootstrap-wrapper .col-sm-12, .bootstrap-wrapper .col-sm, .bootstrap-wrapper .col-sm-auto, .bootstrap-wrapper .col-md-1, .bootstrap-wrapper .col-md-2, .bootstrap-wrapper .col-md-3, .bootstrap-wrapper .col-md-4, .bootstrap-wrapper .col-md-5, .bootstrap-wrapper .col-md-6, .bootstrap-wrapper .col-md-7, .bootstrap-wrapper .col-md-8, .bootstrap-wrapper .col-md-9, .bootstrap-wrapper .col-md-10, .bootstrap-wrapper .col-md-11, .bootstrap-wrapper .col-md-12, .bootstrap-wrapper .col-md, .bootstrap-wrapper .col-md-auto, .bootstrap-wrapper .col-lg-1, .bootstrap-wrapper .col-lg-2, .bootstrap-wrapper .col-lg-3, .bootstrap-wrapper .col-lg-4, .bootstrap-wrapper .col-lg-5, .bootstrap-wrapper .col-lg-6, .bootstrap-wrapper .col-lg-7, .bootstrap-wrapper .col-lg-8, .bootstrap-wrapper .col-lg-9, .bootstrap-wrapper .col-lg-10, .bootstrap-wrapper .col-lg-11, .bootstrap-wrapper .col-lg-12, .bootstrap-wrapper .col-lg, .bootstrap-wrapper .col-lg-auto, .bootstrap-wrapper .col-xl-1, .bootstrap-wrapper .col-xl-2, .bootstrap-wrapper .col-xl-3, .bootstrap-wrapper .col-xl-4, .bootstrap-wrapper .col-xl-5, .bootstrap-wrapper .col-xl-6, .bootstrap-wrapper .col-xl-7, .bootstrap-wrapper .col-xl-8, .bootstrap-wrapper .col-xl-9, .bootstrap-wrapper .col-xl-10, .bootstrap-wrapper .col-xl-11, .bootstrap-wrapper .col-xl-12, .bootstrap-wrapper .col-xl, .bootstrap-wrapper .col-xl-auto { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } .bootstrap-wrapper .col { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .bootstrap-wrapper .col-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-wrapper .col-1 { -webkit-box-flex: 0; -webkit-flex: 0 0 8.3333333333%; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .bootstrap-wrapper .col-2 { -webkit-box-flex: 0; -webkit-flex: 0 0 16.6666666667%; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-wrapper .col-3 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .bootstrap-wrapper .col-4 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333333333%; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-wrapper .col-5 { -webkit-box-flex: 0; -webkit-flex: 0 0 41.6666666667%; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .bootstrap-wrapper .col-6 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .bootstrap-wrapper .col-7 { -webkit-box-flex: 0; -webkit-flex: 0 0 58.3333333333%; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .bootstrap-wrapper .col-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666666667%; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .bootstrap-wrapper .col-9 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .bootstrap-wrapper .col-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 83.3333333333%; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .bootstrap-wrapper .col-11 { -webkit-box-flex: 0; -webkit-flex: 0 0 91.6666666667%; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .bootstrap-wrapper .col-12 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .bootstrap-wrapper .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } .bootstrap-wrapper .order-last { -webkit-box-ordinal-group: 14; -webkit-order: 13; -ms-flex-order: 13; order: 13; } .bootstrap-wrapper .order-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .bootstrap-wrapper .order-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .bootstrap-wrapper .order-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .bootstrap-wrapper .order-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .bootstrap-wrapper .order-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .bootstrap-wrapper .order-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .bootstrap-wrapper .order-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .bootstrap-wrapper .order-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -ms-flex-order: 7; order: 7; } .bootstrap-wrapper .order-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -ms-flex-order: 8; order: 8; } .bootstrap-wrapper .order-9 { -webkit-box-ordinal-group: 10; -webkit-order: 9; -ms-flex-order: 9; order: 9; } .bootstrap-wrapper .order-10 { -webkit-box-ordinal-group: 11; -webkit-order: 10; -ms-flex-order: 10; order: 10; } .bootstrap-wrapper .order-11 { -webkit-box-ordinal-group: 12; -webkit-order: 11; -ms-flex-order: 11; order: 11; } .bootstrap-wrapper .order-12 { -webkit-box-ordinal-group: 13; -webkit-order: 12; -ms-flex-order: 12; order: 12; } .bootstrap-wrapper .offset-1 { margin-left: 8.3333333333%; } .bootstrap-wrapper .offset-2 { margin-left: 16.6666666667%; } .bootstrap-wrapper .offset-3 { margin-left: 25%; } .bootstrap-wrapper .offset-4 { margin-left: 33.3333333333%; } .bootstrap-wrapper .offset-5 { margin-left: 41.6666666667%; } .bootstrap-wrapper .offset-6 { margin-left: 50%; } .bootstrap-wrapper .offset-7 { margin-left: 58.3333333333%; } .bootstrap-wrapper .offset-8 { margin-left: 66.6666666667%; } .bootstrap-wrapper .offset-9 { margin-left: 75%; } .bootstrap-wrapper .offset-10 { margin-left: 83.3333333333%; } .bootstrap-wrapper .offset-11 { margin-left: 91.6666666667%; } @media (min-width: 576px) { .bootstrap-wrapper .col-sm { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .bootstrap-wrapper .col-sm-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-wrapper .col-sm-1 { -webkit-box-flex: 0; -webkit-flex: 0 0 8.3333333333%; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .bootstrap-wrapper .col-sm-2 { -webkit-box-flex: 0; -webkit-flex: 0 0 16.6666666667%; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-wrapper .col-sm-3 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .bootstrap-wrapper .col-sm-4 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333333333%; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-wrapper .col-sm-5 { -webkit-box-flex: 0; -webkit-flex: 0 0 41.6666666667%; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .bootstrap-wrapper .col-sm-6 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .bootstrap-wrapper .col-sm-7 { -webkit-box-flex: 0; -webkit-flex: 0 0 58.3333333333%; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .bootstrap-wrapper .col-sm-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666666667%; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .bootstrap-wrapper .col-sm-9 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .bootstrap-wrapper .col-sm-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 83.3333333333%; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .bootstrap-wrapper .col-sm-11 { -webkit-box-flex: 0; -webkit-flex: 0 0 91.6666666667%; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .bootstrap-wrapper .col-sm-12 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .bootstrap-wrapper .order-sm-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } .bootstrap-wrapper .order-sm-last { -webkit-box-ordinal-group: 14; -webkit-order: 13; -ms-flex-order: 13; order: 13; } .bootstrap-wrapper .order-sm-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .bootstrap-wrapper .order-sm-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .bootstrap-wrapper .order-sm-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .bootstrap-wrapper .order-sm-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .bootstrap-wrapper .order-sm-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .bootstrap-wrapper .order-sm-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .bootstrap-wrapper .order-sm-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .bootstrap-wrapper .order-sm-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -ms-flex-order: 7; order: 7; } .bootstrap-wrapper .order-sm-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -ms-flex-order: 8; order: 8; } .bootstrap-wrapper .order-sm-9 { -webkit-box-ordinal-group: 10; -webkit-order: 9; -ms-flex-order: 9; order: 9; } .bootstrap-wrapper .order-sm-10 { -webkit-box-ordinal-group: 11; -webkit-order: 10; -ms-flex-order: 10; order: 10; } .bootstrap-wrapper .order-sm-11 { -webkit-box-ordinal-group: 12; -webkit-order: 11; -ms-flex-order: 11; order: 11; } .bootstrap-wrapper .order-sm-12 { -webkit-box-ordinal-group: 13; -webkit-order: 12; -ms-flex-order: 12; order: 12; } .bootstrap-wrapper .offset-sm-0 { margin-left: 0; } .bootstrap-wrapper .offset-sm-1 { margin-left: 8.3333333333%; } .bootstrap-wrapper .offset-sm-2 { margin-left: 16.6666666667%; } .bootstrap-wrapper .offset-sm-3 { margin-left: 25%; } .bootstrap-wrapper .offset-sm-4 { margin-left: 33.3333333333%; } .bootstrap-wrapper .offset-sm-5 { margin-left: 41.6666666667%; } .bootstrap-wrapper .offset-sm-6 { margin-left: 50%; } .bootstrap-wrapper .offset-sm-7 { margin-left: 58.3333333333%; } .bootstrap-wrapper .offset-sm-8 { margin-left: 66.6666666667%; } .bootstrap-wrapper .offset-sm-9 { margin-left: 75%; } .bootstrap-wrapper .offset-sm-10 { margin-left: 83.3333333333%; } .bootstrap-wrapper .offset-sm-11 { margin-left: 91.6666666667%; } } @media (min-width: 768px) { .bootstrap-wrapper .col-md { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .bootstrap-wrapper .col-md-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-wrapper .col-md-1 { -webkit-box-flex: 0; -webkit-flex: 0 0 8.3333333333%; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .bootstrap-wrapper .col-md-2 { -webkit-box-flex: 0; -webkit-flex: 0 0 16.6666666667%; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-wrapper .col-md-3 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .bootstrap-wrapper .col-md-4 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333333333%; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-wrapper .col-md-5 { -webkit-box-flex: 0; -webkit-flex: 0 0 41.6666666667%; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .bootstrap-wrapper .col-md-6 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .bootstrap-wrapper .col-md-7 { -webkit-box-flex: 0; -webkit-flex: 0 0 58.3333333333%; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .bootstrap-wrapper .col-md-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666666667%; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .bootstrap-wrapper .col-md-9 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .bootstrap-wrapper .col-md-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 83.3333333333%; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .bootstrap-wrapper .col-md-11 { -webkit-box-flex: 0; -webkit-flex: 0 0 91.6666666667%; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .bootstrap-wrapper .col-md-12 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .bootstrap-wrapper .order-md-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } .bootstrap-wrapper .order-md-last { -webkit-box-ordinal-group: 14; -webkit-order: 13; -ms-flex-order: 13; order: 13; } .bootstrap-wrapper .order-md-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .bootstrap-wrapper .order-md-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .bootstrap-wrapper .order-md-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .bootstrap-wrapper .order-md-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .bootstrap-wrapper .order-md-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .bootstrap-wrapper .order-md-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .bootstrap-wrapper .order-md-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .bootstrap-wrapper .order-md-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -ms-flex-order: 7; order: 7; } .bootstrap-wrapper .order-md-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -ms-flex-order: 8; order: 8; } .bootstrap-wrapper .order-md-9 { -webkit-box-ordinal-group: 10; -webkit-order: 9; -ms-flex-order: 9; order: 9; } .bootstrap-wrapper .order-md-10 { -webkit-box-ordinal-group: 11; -webkit-order: 10; -ms-flex-order: 10; order: 10; } .bootstrap-wrapper .order-md-11 { -webkit-box-ordinal-group: 12; -webkit-order: 11; -ms-flex-order: 11; order: 11; } .bootstrap-wrapper .order-md-12 { -webkit-box-ordinal-group: 13; -webkit-order: 12; -ms-flex-order: 12; order: 12; } .bootstrap-wrapper .offset-md-0 { margin-left: 0; } .bootstrap-wrapper .offset-md-1 { margin-left: 8.3333333333%; } .bootstrap-wrapper .offset-md-2 { margin-left: 16.6666666667%; } .bootstrap-wrapper .offset-md-3 { margin-left: 25%; } .bootstrap-wrapper .offset-md-4 { margin-left: 33.3333333333%; } .bootstrap-wrapper .offset-md-5 { margin-left: 41.6666666667%; } .bootstrap-wrapper .offset-md-6 { margin-left: 50%; } .bootstrap-wrapper .offset-md-7 { margin-left: 58.3333333333%; } .bootstrap-wrapper .offset-md-8 { margin-left: 66.6666666667%; } .bootstrap-wrapper .offset-md-9 { margin-left: 75%; } .bootstrap-wrapper .offset-md-10 { margin-left: 83.3333333333%; } .bootstrap-wrapper .offset-md-11 { margin-left: 91.6666666667%; } } @media (min-width: 992px) { .bootstrap-wrapper .col-lg { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .bootstrap-wrapper .col-lg-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-wrapper .col-lg-1 { -webkit-box-flex: 0; -webkit-flex: 0 0 8.3333333333%; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .bootstrap-wrapper .col-lg-2 { -webkit-box-flex: 0; -webkit-flex: 0 0 16.6666666667%; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-wrapper .col-lg-3 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .bootstrap-wrapper .col-lg-4 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333333333%; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-wrapper .col-lg-5 { -webkit-box-flex: 0; -webkit-flex: 0 0 41.6666666667%; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .bootstrap-wrapper .col-lg-6 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .bootstrap-wrapper .col-lg-7 { -webkit-box-flex: 0; -webkit-flex: 0 0 58.3333333333%; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .bootstrap-wrapper .col-lg-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666666667%; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .bootstrap-wrapper .col-lg-9 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .bootstrap-wrapper .col-lg-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 83.3333333333%; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .bootstrap-wrapper .col-lg-11 { -webkit-box-flex: 0; -webkit-flex: 0 0 91.6666666667%; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .bootstrap-wrapper .col-lg-12 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .bootstrap-wrapper .order-lg-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } .bootstrap-wrapper .order-lg-last { -webkit-box-ordinal-group: 14; -webkit-order: 13; -ms-flex-order: 13; order: 13; } .bootstrap-wrapper .order-lg-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .bootstrap-wrapper .order-lg-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .bootstrap-wrapper .order-lg-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .bootstrap-wrapper .order-lg-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .bootstrap-wrapper .order-lg-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .bootstrap-wrapper .order-lg-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .bootstrap-wrapper .order-lg-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .bootstrap-wrapper .order-lg-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -ms-flex-order: 7; order: 7; } .bootstrap-wrapper .order-lg-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -ms-flex-order: 8; order: 8; } .bootstrap-wrapper .order-lg-9 { -webkit-box-ordinal-group: 10; -webkit-order: 9; -ms-flex-order: 9; order: 9; } .bootstrap-wrapper .order-lg-10 { -webkit-box-ordinal-group: 11; -webkit-order: 10; -ms-flex-order: 10; order: 10; } .bootstrap-wrapper .order-lg-11 { -webkit-box-ordinal-group: 12; -webkit-order: 11; -ms-flex-order: 11; order: 11; } .bootstrap-wrapper .order-lg-12 { -webkit-box-ordinal-group: 13; -webkit-order: 12; -ms-flex-order: 12; order: 12; } .bootstrap-wrapper .offset-lg-0 { margin-left: 0; } .bootstrap-wrapper .offset-lg-1 { margin-left: 8.3333333333%; } .bootstrap-wrapper .offset-lg-2 { margin-left: 16.6666666667%; } .bootstrap-wrapper .offset-lg-3 { margin-left: 25%; } .bootstrap-wrapper .offset-lg-4 { margin-left: 33.3333333333%; } .bootstrap-wrapper .offset-lg-5 { margin-left: 41.6666666667%; } .bootstrap-wrapper .offset-lg-6 { margin-left: 50%; } .bootstrap-wrapper .offset-lg-7 { margin-left: 58.3333333333%; } .bootstrap-wrapper .offset-lg-8 { margin-left: 66.6666666667%; } .bootstrap-wrapper .offset-lg-9 { margin-left: 75%; } .bootstrap-wrapper .offset-lg-10 { margin-left: 83.3333333333%; } .bootstrap-wrapper .offset-lg-11 { margin-left: 91.6666666667%; } } @media (min-width: 1200px) { .bootstrap-wrapper .col-xl { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .bootstrap-wrapper .col-xl-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .bootstrap-wrapper .col-xl-1 { -webkit-box-flex: 0; -webkit-flex: 0 0 8.3333333333%; -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333%; } .bootstrap-wrapper .col-xl-2 { -webkit-box-flex: 0; -webkit-flex: 0 0 16.6666666667%; -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .bootstrap-wrapper .col-xl-3 { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .bootstrap-wrapper .col-xl-4 { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3333333333%; -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .bootstrap-wrapper .col-xl-5 { -webkit-box-flex: 0; -webkit-flex: 0 0 41.6666666667%; -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667%; } .bootstrap-wrapper .col-xl-6 { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .bootstrap-wrapper .col-xl-7 { -webkit-box-flex: 0; -webkit-flex: 0 0 58.3333333333%; -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333%; } .bootstrap-wrapper .col-xl-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 66.6666666667%; -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667%; } .bootstrap-wrapper .col-xl-9 { -webkit-box-flex: 0; -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .bootstrap-wrapper .col-xl-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 83.3333333333%; -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333%; } .bootstrap-wrapper .col-xl-11 { -webkit-box-flex: 0; -webkit-flex: 0 0 91.6666666667%; -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667%; } .bootstrap-wrapper .col-xl-12 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .bootstrap-wrapper .order-xl-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -ms-flex-order: -1; order: -1; } .bootstrap-wrapper .order-xl-last { -webkit-box-ordinal-group: 14; -webkit-order: 13; -ms-flex-order: 13; order: 13; } .bootstrap-wrapper .order-xl-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -ms-flex-order: 0; order: 0; } .bootstrap-wrapper .order-xl-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .bootstrap-wrapper .order-xl-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .bootstrap-wrapper .order-xl-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .bootstrap-wrapper .order-xl-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .bootstrap-wrapper .order-xl-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .bootstrap-wrapper .order-xl-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .bootstrap-wrapper .order-xl-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -ms-flex-order: 7; order: 7; } .bootstrap-wrapper .order-xl-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -ms-flex-order: 8; order: 8; } .bootstrap-wrapper .order-xl-9 { -webkit-box-ordinal-group: 10; -webkit-order: 9; -ms-flex-order: 9; order: 9; } .bootstrap-wrapper .order-xl-10 { -webkit-box-ordinal-group: 11; -webkit-order: 10; -ms-flex-order: 10; order: 10; } .bootstrap-wrapper .order-xl-11 { -webkit-box-ordinal-group: 12; -webkit-order: 11; -ms-flex-order: 11; order: 11; } .bootstrap-wrapper .order-xl-12 { -webkit-box-ordinal-group: 13; -webkit-order: 12; -ms-flex-order: 12; order: 12; } .bootstrap-wrapper .offset-xl-0 { margin-left: 0; } .bootstrap-wrapper .offset-xl-1 { margin-left: 8.3333333333%; } .bootstrap-wrapper .offset-xl-2 { margin-left: 16.6666666667%; } .bootstrap-wrapper .offset-xl-3 { margin-left: 25%; } .bootstrap-wrapper .offset-xl-4 { margin-left: 33.3333333333%; } .bootstrap-wrapper .offset-xl-5 { margin-left: 41.6666666667%; } .bootstrap-wrapper .offset-xl-6 { margin-left: 50%; } .bootstrap-wrapper .offset-xl-7 { margin-left: 58.3333333333%; } .bootstrap-wrapper .offset-xl-8 { margin-left: 66.6666666667%; } .bootstrap-wrapper .offset-xl-9 { margin-left: 75%; } .bootstrap-wrapper .offset-xl-10 { margin-left: 83.3333333333%; } .bootstrap-wrapper .offset-xl-11 { margin-left: 91.6666666667%; } } .bootstrap-wrapper .img-fluid { max-width: 100%; height: auto; }