MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
(80 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;700&display=swap'); | |||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
.portal.first.persistent{ | |||
/* Remove first nav item in sidebar because it doesnt have dropdown functionality, remove this if you want standard links at top of nav */ | |||
display:none; | |||
} | |||
body, #mw-head { | |||
background-color: #101214; | |||
} | |||
.page-Main_Page #bodyContent{ | |||
font-size: 14px; | |||
} | |||
.page-Main_Page h1,.page-Main_Page h2,.page-Main_Page h3,.page-Main_Page h4,.page-Main_Page h5,.page-Main_Page h6{ | |||
margin: 0; | |||
padding: 0; | |||
} | |||
h1,h2,h3,h4,h5,h6{ | |||
font-family: 'Montserrat', sans-serif; | |||
color: #393F4D; | |||
} | |||
p, a, dd{ | |||
font-family: Arial, Helvetica, sans-serif; | |||
} | |||
.mw-body{ | |||
/*min-width: 450px;*/ | |||
} | |||
#mw-head { | |||
background-image: url("https://wiki.careers.securegroup.com/images/f/ff/Sg-wiki-header-banner.jpg"); | |||
} | |||
.mw-parser-output a.external:visited{ | |||
color: inherit; | |||
} | |||
a, a:visited, a.new:visited, #p-personal a.new:visited, a.new{ | |||
color: #4A76FD; | |||
} | |||
#ca-watch{ | |||
display: none; | |||
} | |||
.mw-content-ltr dd, .mw-content-rtl .mw-content-ltr dd{ | |||
margin-left: 0; | |||
} | |||
li{ | |||
list-style-image: none; | |||
} | |||
.page-Main_Page #firstHeading{ | |||
display: none; | |||
} | |||
#ca-unwatch{ | |||
display: none; | |||
} | |||
.page-Main_Page ::marker { | |||
color: #4A76FD; | |||
} | |||
#toc{ | |||
margin-left: 0px; | |||
} | |||
#mw-panel.collapsible-nav .portal.collapsed h3 a, #mw-panel.collapsible-nav .portal h3 a, #mw-panel .portal .body li a, #mw-panel .portal .body li a:visited, .vectorTabs span a, #footer li{ | |||
color: #FFFFFF; | |||
} | |||
.vectorTabs li a{ | |||
color: #FFFFFF; | |||
} | |||
.vectorTabs li.selected{ | |||
background-color: #FFFFFF; | |||
color: #101214; | |||
} | |||
#left-navigation #p-namespaces ul li, #left-navigation #p-namespaces ul li a, #right-navigation #p-views ul li, #right-navigation #p-views ul li a{ | |||
border-top-right-radius: 8px; | |||
border-top-left-radius: 8px; | |||
} | |||
#simpleSearch,#simpleSearch input{ | |||
border-radius: 8px; | |||
} | |||
.grid.three-columns, .grid.two-columns, .grid-wrapper{ | |||
margin-bottom: 30px; | |||
} | |||
.grid-wrapper .grid.three-columns{ | |||
margin: 0; | |||
} | |||
.grid.two-columns .box-header p a, .social-media a.external{ | |||
color: #282828; | |||
} | |||
.social-media a.external:hover{ | |||
color: #4A76FD; | |||
} | |||
#mw-panel .portal ul li a, #mw-panel .portal.expanded ul li a{ | |||
color: #BCBCBC !important; | |||
} | |||
#p-logo a, #p-logo{ | |||
height: 80px; | |||
} | |||
#simpleSearch{ | |||
background-color: #FFFFFF; | |||
} | |||
#mw-head{ | |||
height: 100px; | |||
} | |||
#left-navigation, #right-navigation{ | |||
margin-top: 4.15em; | |||
} | |||
.vectorTabs, #mw-head .vectorMenu h3{ | |||
height: 2.1em; | |||
} | |||
.vectorMenu h3 span{ | |||
padding-top: 0.8em; | |||
color: #FFF; | |||
} | |||
.vectorTabs span a{ | |||
padding-top: 0.8em; | |||
} | |||
.vectorTabs .new a, .vectorTabs .new a:visited { | |||
color: #FFFFFF; | |||
} | |||
.vectorTabs .selected.new a, .vectorTabs .selected.new a:visited { | |||
color: #101214; | |||
} | |||
.vectorTabs .mw-watchlink.icon a{ | |||
padding-top: 2.576923em; | |||
} | |||
#p-search form{ | |||
margin: 0.2em 0 0; | |||
} | |||
#firstHeading{ | |||
margin-top: 20px; | |||
} | |||
#mw-panel .portal:not(:last-child){ | |||
border-bottom: 1px solid #FFF; | |||
padding: 0.25em 0 0.6em; | |||
} | |||
#mw-panel.collapsible-nav .portal .body{ | |||
margin: 0 0 0 12px; | |||
} | |||
#mw-panel.collapsible-nav .portal.collapsed h3, #mw-panel.collapsible-nav .portal h3{ | |||
background-image: none; | |||
margin-left: 4px; | |||
padding-left: 8px; | |||
} | |||
#mw-panel.collapsible-nav .portal.collapsed h3:before, #mw-panel.collapsible-nav .portal h3:before{ | |||
content: "›"; | |||
position: absolute; | |||
display: inline-block; | |||
left: 20px; | |||
color: #FFFFFF; | |||
font-size: 19px; | |||
line-height: 1; | |||
margin-top: -4px; | |||
transition: .2s; | |||
} | |||
#mw-panel .portal .body ul{ | |||
padding-left: 6px; | |||
} | |||
.vectorTabs li, #right-navigation .vectorTabs .collapsible:not(.selected) a{ | |||
background-color: #4A76FD; | |||
background-image: none; | |||
} | |||
#mw-panel.collapsible-nav .portal.expanded h3:before{ | |||
color: #4A76FD; | |||
transform: rotate(90deg); | |||
margin-top: -2px; | |||
left: 20px; | |||
font-weight: bold; | |||
} | |||
.vectorTabs .new a, .vectorTabs span a{ | |||
height: 1.8em; | |||
} | |||
.grid-wrapper{ | |||
border: 2px solid #BCBCBC; | |||
border-radius: 8px; | |||
padding: 10px; | |||
} | |||
.grid-wrapper .header, .box .header{ | |||
background-color: #E9E9E9; | |||
color: #101214; | |||
text-align: center; | |||
border-radius: 8px; | |||
padding: 10px 15px; | |||
} | |||
.header{ | |||
position: relative; | |||
} | |||
.header p{ | |||
position: absolute; | |||
display: flex; | |||
right: 10px; | |||
top: 0; | |||
bottom: 0; | |||
margin: auto; | |||
} | |||
.header p img{ | |||
align-self: center; | |||
} | |||
.grid{ | .grid{ | ||
display: grid; | display: grid; | ||
gap: 20px; | |||
} | } | ||
.grid.two-columns{ | .grid.two-columns{ | ||
grid-template-columns: repeat(auto-fit,minmax(450px,1fr)); | grid-template-columns: repeat(auto-fit,minmax(450px,1fr)); | ||
margin: 15px 0; | } | ||
.social-media a.external{ | |||
padding-right: 0px; | |||
background-image: none; | |||
margin: 0 5px; | |||
} | |||
.social-media .icon{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/3/3f/Facebook_icon.png"); | |||
width: 20px; | |||
height: 20px; | |||
display: inline-block; | |||
background-size: cover; | |||
top: 3px; | |||
position: relative; | |||
margin-left: 5px; | |||
} | |||
.box-content{ | |||
height: 100%; | |||
box-sizing: border-box; | |||
} | |||
.box-content.social-media{ | |||
border-radius: 8px; | |||
background: #E9E9E9; | |||
box-shadow: 0px 3px 6px #00000029; | |||
border: 2px solid #BCBCBC; | |||
} | |||
.box-content.social-media p{ | |||
display: flex; | |||
justify-content: center; | |||
padding: 20px; | |||
gap: 20px; | |||
} | |||
.social-media a .icon.fb{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/3/3f/Facebook_icon.png"); | |||
} | |||
.social-media a:hover .icon.fb{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/0/0e/Facebook_icon_hover.png"); | |||
} | |||
.social-media a .icon.sg{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/0/00/Career_icon.png"); | |||
} | |||
.social-media a:hover .icon.sg{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/c/c1/Career_icon_hover.png"); | |||
} | |||
.social-media a .icon.blog{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/2/22/Blog_icon.png"); | |||
} | |||
.social-media a:hover .icon.blog{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/d/de/Blog_icon_hover.png"); | |||
} | |||
.social-media a .icon.linkedin{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/1/1e/Linkedin_icon.png"); | |||
} | |||
.social-media a:hover .icon.linkedin{ | |||
background-image: url("https://wiki.careers.securegroup.com/images/f/fe/Linkedin_icon_hover.png"); | |||
} | |||
.social-media a .icon.insta{ | |||
background-image: url("/images/9/91/SG-Icon-Wiki-Social-Instagram-desk.png"); | |||
} | |||
.social-media a:hover .icon.insta{ | |||
background-image: url("/images/0/0d/SG-Icon-Wiki-Social-Instagram-blue-desk.png"); | |||
} | |||
.social-media a.external:hover{ | |||
text-decoration: none; | |||
} | |||
.grid.two-columns.slideshare .text .box-content{ | |||
background-color: #ECF1FF; | |||
border-radius: 8px; | |||
padding: 30px; | |||
} | |||
.grid.two-columns.slideshare .text .box-content > *:not(ul){ | |||
margin: 15px 0; | |||
} | |||
.grid.two-columns.slideshare .text .box-content > *:first-child { | |||
margin: 0 0 15px; | |||
} | |||
.grid.two-columns.slideshare .text .box-content > *:last-child { | |||
margin: 15px 0 0; | |||
} | |||
.slideshare-wrapper{ | |||
box-shadow: 0px 3px 6px #00000029; | |||
border: 2px solid #BCBCBC; | |||
padding: 10px; | |||
border-radius: 8px; | |||
width:auto; | |||
margin-top: 30px; | |||
} | |||
.slideshare-wrapper h5{ | |||
background-color: #E9E9E9; | |||
padding: 10px; | |||
border-radius: 8px; | |||
} | |||
.slideshare iframe{ | |||
height: 310px; | |||
width: 475px; | |||
} | |||
.grid.two-columns.slideshare{ | |||
/*grid-template-columns: repeat(auto-fill,minmax(450px,1fr));*/ | |||
grid-template-columns: 1fr 1fr 1fr; | |||
} | |||
.grid.two-columns.slideshare .text{ | |||
grid-column: span 2; | |||
} | } | ||
.grid.two-columns.two-thirds-left{ | .grid.two-columns.two-thirds-left{ | ||
Line 16: | Line 316: | ||
} | } | ||
.grid.three-columns{ | .grid.three-columns{ | ||
grid-template-columns: repeat(auto-fit,minmax( | /*grid-template-columns: repeat(auto-fit,minmax(400px,1fr));*/ | ||
grid-template-columns: repeat(3, 1fr); | |||
} | } | ||
.grid.three-columns.color-boxes{ | |||
.grid.three-columns | grid-template-columns: repeat(auto-fit,minmax(450px,1fr)); | ||
} | } | ||
Line 39: | Line 331: | ||
} | } | ||
.boxes .box{ | |||
border: 2px solid #BCBCBC; | |||
border-radius: 8px; | |||
padding: 10px; | |||
} | |||
.boxes .box .content{ | |||
max-height: 800px; | |||
overflow: auto; | |||
padding: 0 15px; | |||
margin-top: 20px; | |||
} | |||
.boxes .box.sgmm .content, .boxes .box.changes .content{ | |||
max-height: 420px; | |||
} | |||
.boxes .box.media .content{ | |||
width: fit-content; | |||
margin: 20px auto 0; | |||
} | |||
/* Media box */ | |||
.box.media .content{ | |||
padding: 0; | |||
} | |||
.box.media table{ | |||
border-collapse: separate; | |||
border-spacing: 10px; | |||
font-size: 11px; | |||
color: #101214; | |||
} | |||
.box.media table td{ | |||
border: 1px solid #BCBCBC; | |||
background: #F5F5F6; | |||
padding: 5px; | |||
} | |||
.box.media table b{ | |||
display: block; | |||
margin: 15px 0 10px; | |||
font-weight: 400; | |||
} | |||
/* Changes list */ | |||
.box.changes .date{ | |||
display: block; | |||
color: #888B94; | |||
font-size: 14px; | |||
} | |||
/* News / sgmm */ | |||
.box.sgmm .feed-item{ | |||
padding: 20px 0; | |||
} | |||
.box.sgmm .feed-item:first-of-type{ | |||
padding-top: 0; | |||
} | |||
.box .feed-item dd{ | |||
font-size: 12px; | |||
color: #888B94; | |||
} | |||
.box .feed-item dd p{ | |||
display: none; | |||
} | |||
.box.news .hs-featured-image-wrapper img{ | |||
max-width: 152px !important; | |||
margin: 0 20px 0 0 !important; | |||
} | |||
.box.news .hs-featured-image-wrapper pre{ | |||
white-space: initial; | |||
margin: 0; | |||
} | |||
.box.news .hs-featured-image-wrapper a:hover{ | |||
text-decoration: none; | |||
} | |||
.box.news .mw-parser-output{ | |||
display: grid; | |||
row-gap: 18px; | |||
grid-template-rows: 83px; | |||
} | |||
.feed-item{ | |||
display: flex; | |||
} | |||
.feed-item .plainlinks{ | |||
margin-top: 0; | |||
} | |||
.feed-item > dl{ | |||
margin: 0; | |||
} | |||
.box .feed-item{ | |||
border-bottom: 1px solid #E9E9E9; | |||
} | |||
.box .feed-item .plainlinks a{ | |||
color: #393F4D; | |||
font-family: 'Montserrat',sans-serif; | |||
font-size: 14px; | |||
line-height: 1.4; | |||
margin-bottom: 5px; | |||
display: block; | |||
} | |||
.page-Main_Page .mw-parser-output > p{ | |||
display: none; | |||
} | |||
.page-Main_Page .wikitable{ | |||
width: 100%; | |||
background-color: transparent; | |||
border: none; | |||
margin: 0; | |||
} | |||
/* Positions */ | |||
.box.positions .content > p{ | |||
display: none; | |||
} | |||
.wikitable a.external{ | |||
background-image: none; | |||
display: block; | |||
} | |||
.box.positions .wikitable td{ | |||
border: none; | |||
border-bottom: 1px solid #E9E9E9; | |||
} | |||
.box.positions .wikitable td p{ | |||
color: #888B94; | |||
font-size: 12px; | |||
} | |||
/* Common */ | /* Common */ | ||
.box-header{ | .box-header{ | ||
font-weight: bold; | font-weight: bold; | ||
font-size: | font-size: 1rem; | ||
border-bottom: 1px solid # | border-bottom: 1px solid #BCBCBC; | ||
margin-bottom: 15px; | |||
} | |||
.box-header p{ | |||
display: flex; | |||
align-items: center; | |||
} | |||
.box-header a{ | |||
color: #101214; | |||
font-family: 'Montserrat',sans-serif; | |||
} | |||
.box-header img{ | |||
margin-right: 10px; | |||
} | } | ||
.box- | .header h5{ | ||
padding: 10px; | display: inline-block; | ||
padding: 0 40px; | |||
} | |||
.color-boxes > div{ | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.color-boxes ul{ | |||
display: grid; | |||
grid-template-columns: repeat( auto-fit, minmax(100px, 1fr) ); | |||
margin: 0; | |||
gap: 10px; | |||
list-style: none; | |||
font-size: 13px; | |||
height: 100%; | |||
} | |||
.color-boxes ul li{ | |||
width: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
align-items: center; | |||
padding: 15px 0; | |||
text-align: center; | |||
} | |||
.color-boxes ul li img{ | |||
margin-bottom: 10px; | |||
} | |||
.color-boxes div{ | |||
border-radius: 8px; | |||
} | |||
.color-boxes > div li{ | |||
border: 1px solid #4A76FD; | |||
border-radius: 8px; | |||
justify-content: center; | |||
} | |||
.color-boxes > div .box-header{ | |||
margin: 10px 0 20px; | |||
} | |||
.color-boxes > div .box-header > *{ | |||
padding: 10px 0; | |||
margin: 0; | |||
color: #FFFFFF; | |||
} | |||
.color-boxes > div:nth-child(1) .box-header{ | |||
background-color: #4A76FD; | |||
} | |||
.color-boxes > div:nth-child(1) li{ | |||
background-color: #ECF1FF; | |||
} | |||
.color-boxes > div:nth-child(2) .box-header{ | |||
background-color: #FF5E5E; | |||
} | |||
.color-boxes > div:nth-child(2) li{ | |||
border-color: #FF5E5E; | |||
background-color: #FFEEEE; | |||
} | |||
.color-boxes > div:nth-child(3) .box-header{ | |||
background-color: #46A8A5; | |||
} | |||
.color-boxes > div:nth-child(3) li{ | |||
background-color: #ECF6F6; | |||
border-color: #46A8A5; | |||
} | } | ||
.box-content.framework{ | .box-content.framework{ | ||
display: grid; | display: grid; | ||
grid-template-columns: repeat( | grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); | ||
row-gap: 10px; | |||
column-gap: 30px; | |||
margin-bottom: 20px; | |||
} | |||
.box-content.framework > div > p{ | |||
margin-bottom: 0; | |||
} | } | ||
.text-center{ | .text-center{ | ||
Line 60: | Line 556: | ||
border: none; | border: none; | ||
padding: 0; | padding: 0; | ||
white-space: pre-wrap; | white-space: initial; | ||
/*white-space: pre-wrap;*/ | |||
} | |||
iframe{ | |||
/*width: 100%; | |||
height: 100%;*/ | |||
} | } | ||
#catlinks{ | |||
display: none; | |||
} | } |
Latest revision as of 12:19, 28 January 2021
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;700&display=swap');
/* CSS placed here will be applied to all skins */
.portal.first.persistent{
/* Remove first nav item in sidebar because it doesnt have dropdown functionality, remove this if you want standard links at top of nav */
display:none;
}
body, #mw-head {
background-color: #101214;
}
.page-Main_Page #bodyContent{
font-size: 14px;
}
.page-Main_Page h1,.page-Main_Page h2,.page-Main_Page h3,.page-Main_Page h4,.page-Main_Page h5,.page-Main_Page h6{
margin: 0;
padding: 0;
}
h1,h2,h3,h4,h5,h6{
font-family: 'Montserrat', sans-serif;
color: #393F4D;
}
p, a, dd{
font-family: Arial, Helvetica, sans-serif;
}
.mw-body{
/*min-width: 450px;*/
}
#mw-head {
background-image: url("https://wiki.careers.securegroup.com/images/f/ff/Sg-wiki-header-banner.jpg");
}
.mw-parser-output a.external:visited{
color: inherit;
}
a, a:visited, a.new:visited, #p-personal a.new:visited, a.new{
color: #4A76FD;
}
#ca-watch{
display: none;
}
.mw-content-ltr dd, .mw-content-rtl .mw-content-ltr dd{
margin-left: 0;
}
li{
list-style-image: none;
}
.page-Main_Page #firstHeading{
display: none;
}
#ca-unwatch{
display: none;
}
.page-Main_Page ::marker {
color: #4A76FD;
}
#toc{
margin-left: 0px;
}
#mw-panel.collapsible-nav .portal.collapsed h3 a, #mw-panel.collapsible-nav .portal h3 a, #mw-panel .portal .body li a, #mw-panel .portal .body li a:visited, .vectorTabs span a, #footer li{
color: #FFFFFF;
}
.vectorTabs li a{
color: #FFFFFF;
}
.vectorTabs li.selected{
background-color: #FFFFFF;
color: #101214;
}
#left-navigation #p-namespaces ul li, #left-navigation #p-namespaces ul li a, #right-navigation #p-views ul li, #right-navigation #p-views ul li a{
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
#simpleSearch,#simpleSearch input{
border-radius: 8px;
}
.grid.three-columns, .grid.two-columns, .grid-wrapper{
margin-bottom: 30px;
}
.grid-wrapper .grid.three-columns{
margin: 0;
}
.grid.two-columns .box-header p a, .social-media a.external{
color: #282828;
}
.social-media a.external:hover{
color: #4A76FD;
}
#mw-panel .portal ul li a, #mw-panel .portal.expanded ul li a{
color: #BCBCBC !important;
}
#p-logo a, #p-logo{
height: 80px;
}
#simpleSearch{
background-color: #FFFFFF;
}
#mw-head{
height: 100px;
}
#left-navigation, #right-navigation{
margin-top: 4.15em;
}
.vectorTabs, #mw-head .vectorMenu h3{
height: 2.1em;
}
.vectorMenu h3 span{
padding-top: 0.8em;
color: #FFF;
}
.vectorTabs span a{
padding-top: 0.8em;
}
.vectorTabs .new a, .vectorTabs .new a:visited {
color: #FFFFFF;
}
.vectorTabs .selected.new a, .vectorTabs .selected.new a:visited {
color: #101214;
}
.vectorTabs .mw-watchlink.icon a{
padding-top: 2.576923em;
}
#p-search form{
margin: 0.2em 0 0;
}
#firstHeading{
margin-top: 20px;
}
#mw-panel .portal:not(:last-child){
border-bottom: 1px solid #FFF;
padding: 0.25em 0 0.6em;
}
#mw-panel.collapsible-nav .portal .body{
margin: 0 0 0 12px;
}
#mw-panel.collapsible-nav .portal.collapsed h3, #mw-panel.collapsible-nav .portal h3{
background-image: none;
margin-left: 4px;
padding-left: 8px;
}
#mw-panel.collapsible-nav .portal.collapsed h3:before, #mw-panel.collapsible-nav .portal h3:before{
content: "›";
position: absolute;
display: inline-block;
left: 20px;
color: #FFFFFF;
font-size: 19px;
line-height: 1;
margin-top: -4px;
transition: .2s;
}
#mw-panel .portal .body ul{
padding-left: 6px;
}
.vectorTabs li, #right-navigation .vectorTabs .collapsible:not(.selected) a{
background-color: #4A76FD;
background-image: none;
}
#mw-panel.collapsible-nav .portal.expanded h3:before{
color: #4A76FD;
transform: rotate(90deg);
margin-top: -2px;
left: 20px;
font-weight: bold;
}
.vectorTabs .new a, .vectorTabs span a{
height: 1.8em;
}
.grid-wrapper{
border: 2px solid #BCBCBC;
border-radius: 8px;
padding: 10px;
}
.grid-wrapper .header, .box .header{
background-color: #E9E9E9;
color: #101214;
text-align: center;
border-radius: 8px;
padding: 10px 15px;
}
.header{
position: relative;
}
.header p{
position: absolute;
display: flex;
right: 10px;
top: 0;
bottom: 0;
margin: auto;
}
.header p img{
align-self: center;
}
.grid{
display: grid;
gap: 20px;
}
.grid.two-columns{
grid-template-columns: repeat(auto-fit,minmax(450px,1fr));
}
.social-media a.external{
padding-right: 0px;
background-image: none;
margin: 0 5px;
}
.social-media .icon{
background-image: url("https://wiki.careers.securegroup.com/images/3/3f/Facebook_icon.png");
width: 20px;
height: 20px;
display: inline-block;
background-size: cover;
top: 3px;
position: relative;
margin-left: 5px;
}
.box-content{
height: 100%;
box-sizing: border-box;
}
.box-content.social-media{
border-radius: 8px;
background: #E9E9E9;
box-shadow: 0px 3px 6px #00000029;
border: 2px solid #BCBCBC;
}
.box-content.social-media p{
display: flex;
justify-content: center;
padding: 20px;
gap: 20px;
}
.social-media a .icon.fb{
background-image: url("https://wiki.careers.securegroup.com/images/3/3f/Facebook_icon.png");
}
.social-media a:hover .icon.fb{
background-image: url("https://wiki.careers.securegroup.com/images/0/0e/Facebook_icon_hover.png");
}
.social-media a .icon.sg{
background-image: url("https://wiki.careers.securegroup.com/images/0/00/Career_icon.png");
}
.social-media a:hover .icon.sg{
background-image: url("https://wiki.careers.securegroup.com/images/c/c1/Career_icon_hover.png");
}
.social-media a .icon.blog{
background-image: url("https://wiki.careers.securegroup.com/images/2/22/Blog_icon.png");
}
.social-media a:hover .icon.blog{
background-image: url("https://wiki.careers.securegroup.com/images/d/de/Blog_icon_hover.png");
}
.social-media a .icon.linkedin{
background-image: url("https://wiki.careers.securegroup.com/images/1/1e/Linkedin_icon.png");
}
.social-media a:hover .icon.linkedin{
background-image: url("https://wiki.careers.securegroup.com/images/f/fe/Linkedin_icon_hover.png");
}
.social-media a .icon.insta{
background-image: url("/images/9/91/SG-Icon-Wiki-Social-Instagram-desk.png");
}
.social-media a:hover .icon.insta{
background-image: url("/images/0/0d/SG-Icon-Wiki-Social-Instagram-blue-desk.png");
}
.social-media a.external:hover{
text-decoration: none;
}
.grid.two-columns.slideshare .text .box-content{
background-color: #ECF1FF;
border-radius: 8px;
padding: 30px;
}
.grid.two-columns.slideshare .text .box-content > *:not(ul){
margin: 15px 0;
}
.grid.two-columns.slideshare .text .box-content > *:first-child {
margin: 0 0 15px;
}
.grid.two-columns.slideshare .text .box-content > *:last-child {
margin: 15px 0 0;
}
.slideshare-wrapper{
box-shadow: 0px 3px 6px #00000029;
border: 2px solid #BCBCBC;
padding: 10px;
border-radius: 8px;
width:auto;
margin-top: 30px;
}
.slideshare-wrapper h5{
background-color: #E9E9E9;
padding: 10px;
border-radius: 8px;
}
.slideshare iframe{
height: 310px;
width: 475px;
}
.grid.two-columns.slideshare{
/*grid-template-columns: repeat(auto-fill,minmax(450px,1fr));*/
grid-template-columns: 1fr 1fr 1fr;
}
.grid.two-columns.slideshare .text{
grid-column: span 2;
}
.grid.two-columns.two-thirds-left{
grid-template-columns: repeat(auto-fit,minmax(450px,3fr));
}
.grid.two-columns.two-thirds-left > div:first-child{
grid-column: span 2;
}
.grid.three-columns{
/*grid-template-columns: repeat(auto-fit,minmax(400px,1fr));*/
grid-template-columns: repeat(3, 1fr);
}
.grid.three-columns.color-boxes{
grid-template-columns: repeat(auto-fit,minmax(450px,1fr));
}
.grid.two-columns .full-width{
grid-column: span 2;
}
.grid.three-columns .full-width{
grid-column: span 3;
height: auto;
}
.boxes .box{
border: 2px solid #BCBCBC;
border-radius: 8px;
padding: 10px;
}
.boxes .box .content{
max-height: 800px;
overflow: auto;
padding: 0 15px;
margin-top: 20px;
}
.boxes .box.sgmm .content, .boxes .box.changes .content{
max-height: 420px;
}
.boxes .box.media .content{
width: fit-content;
margin: 20px auto 0;
}
/* Media box */
.box.media .content{
padding: 0;
}
.box.media table{
border-collapse: separate;
border-spacing: 10px;
font-size: 11px;
color: #101214;
}
.box.media table td{
border: 1px solid #BCBCBC;
background: #F5F5F6;
padding: 5px;
}
.box.media table b{
display: block;
margin: 15px 0 10px;
font-weight: 400;
}
/* Changes list */
.box.changes .date{
display: block;
color: #888B94;
font-size: 14px;
}
/* News / sgmm */
.box.sgmm .feed-item{
padding: 20px 0;
}
.box.sgmm .feed-item:first-of-type{
padding-top: 0;
}
.box .feed-item dd{
font-size: 12px;
color: #888B94;
}
.box .feed-item dd p{
display: none;
}
.box.news .hs-featured-image-wrapper img{
max-width: 152px !important;
margin: 0 20px 0 0 !important;
}
.box.news .hs-featured-image-wrapper pre{
white-space: initial;
margin: 0;
}
.box.news .hs-featured-image-wrapper a:hover{
text-decoration: none;
}
.box.news .mw-parser-output{
display: grid;
row-gap: 18px;
grid-template-rows: 83px;
}
.feed-item{
display: flex;
}
.feed-item .plainlinks{
margin-top: 0;
}
.feed-item > dl{
margin: 0;
}
.box .feed-item{
border-bottom: 1px solid #E9E9E9;
}
.box .feed-item .plainlinks a{
color: #393F4D;
font-family: 'Montserrat',sans-serif;
font-size: 14px;
line-height: 1.4;
margin-bottom: 5px;
display: block;
}
.page-Main_Page .mw-parser-output > p{
display: none;
}
.page-Main_Page .wikitable{
width: 100%;
background-color: transparent;
border: none;
margin: 0;
}
/* Positions */
.box.positions .content > p{
display: none;
}
.wikitable a.external{
background-image: none;
display: block;
}
.box.positions .wikitable td{
border: none;
border-bottom: 1px solid #E9E9E9;
}
.box.positions .wikitable td p{
color: #888B94;
font-size: 12px;
}
/* Common */
.box-header{
font-weight: bold;
font-size: 1rem;
border-bottom: 1px solid #BCBCBC;
margin-bottom: 15px;
}
.box-header p{
display: flex;
align-items: center;
}
.box-header a{
color: #101214;
font-family: 'Montserrat',sans-serif;
}
.box-header img{
margin-right: 10px;
}
.header h5{
display: inline-block;
padding: 0 40px;
}
.color-boxes > div{
display: flex;
flex-direction: column;
}
.color-boxes ul{
display: grid;
grid-template-columns: repeat( auto-fit, minmax(100px, 1fr) );
margin: 0;
gap: 10px;
list-style: none;
font-size: 13px;
height: 100%;
}
.color-boxes ul li{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 15px 0;
text-align: center;
}
.color-boxes ul li img{
margin-bottom: 10px;
}
.color-boxes div{
border-radius: 8px;
}
.color-boxes > div li{
border: 1px solid #4A76FD;
border-radius: 8px;
justify-content: center;
}
.color-boxes > div .box-header{
margin: 10px 0 20px;
}
.color-boxes > div .box-header > *{
padding: 10px 0;
margin: 0;
color: #FFFFFF;
}
.color-boxes > div:nth-child(1) .box-header{
background-color: #4A76FD;
}
.color-boxes > div:nth-child(1) li{
background-color: #ECF1FF;
}
.color-boxes > div:nth-child(2) .box-header{
background-color: #FF5E5E;
}
.color-boxes > div:nth-child(2) li{
border-color: #FF5E5E;
background-color: #FFEEEE;
}
.color-boxes > div:nth-child(3) .box-header{
background-color: #46A8A5;
}
.color-boxes > div:nth-child(3) li{
background-color: #ECF6F6;
border-color: #46A8A5;
}
.box-content.framework{
display: grid;
grid-template-columns: repeat(auto-fit,minmax(190px,1fr));
row-gap: 10px;
column-gap: 30px;
margin-bottom: 20px;
}
.box-content.framework > div > p{
margin-bottom: 0;
}
.text-center{
text-align: center;
}
pre{
background-color: transparent;
border: none;
padding: 0;
white-space: initial;
/*white-space: pre-wrap;*/
}
iframe{
/*width: 100%;
height: 100%;*/
}
#catlinks{
display: none;
}