/* General */ /* ---------------------------- */ *, *:before, *:after { box-sizing: border-box; } * > :last-child { margin-bottom: 0; } body:before { content: ""; background: #F5F5F5; position: absolute; top: 0; right: 50%; bottom: 0; left: 0; z-index: -1; } .container { margin: 0 auto; padding: 0 18px; } .container--main { background: #FFFFFF; padding: 0 !important; overflow: hidden; } /* Base Typography */ /* ---------------------------- */ body { font-size: 18px; line-height: 1.5em; font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;; color: #46545C; border-top: 8px solid #222222; background: #FFFFFF; position: relative; } h1, h2, h3, h4, input, button, textarea, label, button, .button { font-family: 'Ubuntu', 'Source Sans Pro', Helvetica, Arial, sans-serif; } h1, h2, h3, h4 { margin-bottom: .85em; line-height: 1.3em; font-weight: 400; } h1 { font-size: 36px; } h1 a { color: inherit; text-decoration: none; } h2 { font-size: 24px; margin-top: 2em; } h2:first-child, .page-title + h2 { margin-top: 0; } h3 { font-size: 18px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 500; } h4 { font-size: 16px; font-weight: 600px; } p, ul, ol, dl, blockquote, code, pre { line-height: 1.5em; margin-bottom: 1.5em; } ul, ol { margin-left: 1.5em; } ul { list-style-type: disc; } ol { list-style-type: decimal; } nav ul, nav ol { list-style: none; margin: 0; padding: 0; } b, strong { font-weight: bold; } i, em { font-style: italic; } small { font-size: 80%; } a, a:visited { outline: none; color: #1578B7; } a:hover { outline: none; text-decoration:none; } a:active, a:focus { outline: none; } img { max-width: 100%; height: auto; display: block; margin: 0 0 1.5em; } figure { margin: 0 0 1.5em; } figure img { margin-bottom: 0; } figcaption { margin-top: .25em; } sup, sub { font-size: .8em; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } code, pre, .commandline { font-family: 'Source Code Pro', monospace; } code, .commandline { display: inline; overflow: auto; padding: 0 0.2em; border-radius: 5px; border: 1px solid #e8e8e8; background-color: #e8e8e8; } pre { background: #333333; color: #EEEEEE; display: block; font-size: .85em; overflow: auto; padding: 12px 18px; } /* Base Forms */ /* ---------------------------- */ label { color: #6666666; } input, textarea { font-family: inherit; background: #FFFFFF; border: 1px solid #CCCCCC; border-radius: 3px; padding: 6px 9px; font-weight: 600; width: 100%; } label, input, textarea, select { font-size: 18px; } input[type="submit"], input[type="checkbox"] { width: auto; } /* HElPERS */ /* ---------------------------- */ .section { padding-top: 1.5em; padding-bottom: 1.5em; } /* ELEMENT: Site Logo */ /* ---------------------------- */ .site-logo { display: block; width: 100%; height: 0; overflow: hidden; padding-top: 23.1%; background: url("schedmd.png") no-repeat 0 0; background-size: contain; text-indent: -99999em; } /* ELEMENT: Site Title */ /* ---------------------------- */ .site-title a { font-weight: normal; text-decoration: none; text-align: center; } .site-title__slogan { color: #888888; font-size: 17px; margin-top: .5em; line-height: 1.2em; } /* ELEMENT: Menu Trigger */ /* ---------------------------- */ .menu-trigger { display: block; background: none; border: none; padding: 25px 18px 29px; transition: .2s; cursor: pointer; user-select: none; opacity: 0.85; } .menu-trigger:hover { opacity: 1; } .menu-trigger:active { transition: 0; background: hsla(0, 0%, 0%, .1); } .menu-trigger:focus { outline: 0; } .menu-trigger__lines, .menu-trigger__lines:before, .menu-trigger__lines:after { display: inline-block; width: 24px; height: 3.5px; background: #222222; border-radius: 2px; transition: .2s; } .menu-trigger__lines { position: relative; } .menu-trigger__lines:before, .menu-trigger__lines:after { position: absolute; left:0; content: ''; transform-origin: 17px center; } .menu-trigger__lines:before { top: 6px; } .menu-trigger__lines:after { top: -6px; } .menu-trigger__lines--closed { background: transparent; } .menu-trigger__lines--closed:before, .menu-trigger__lines--closed:after { transform-origin: 50% 50%; top: 0; width: 24px; } .menu-trigger__lines--closed:before { transform: rotate3d(0,0,1,45deg); } .menu-trigger__lines--closed:after { transform: rotate3d(0,0,1,-45deg); } /* ELEMENT: General Menu */ /* ---------------------------- */ .menu { font-family: 'Ubuntu', 'Source Sans Pro', Helvetica, Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; line-height: 1em; } .menu a { text-decoration: none; opacity: 0.75; display: block; } .menu a:hover { opacity: 1; } /* ELEMENT: Site Menu */ /* ---------------------------- */ .site-menu { margin: 0 0 1.5em; } .site-menu__item div { padding: 24px 0px 0px 38px; } .site-menu__item a { font-size: 20px; color: #595959; } .site-menu__item span { background: #F5F5F5; z-index: 1000; padding: 0 9px; position: relative; } .site-menu__item--current a { opacity: 1; } .site-menu__item--current a:before { content: ""; display: block; border-top: 5px solid #64AEDC; width: 100%; position: absolute; top: 17px; left: 0; } /* ELEMENT: Footer Menu */ /* ---------------------------- */ .footer-menu__item a { font-size: 14px; font-weight: 500; padding: 12px 0; color: #fff; } /* ELEMENT: Feature */ /* ---------------------------- */ .feature { padding: 0 9px; } .feature > * { font-size: 14px; } .feature + .feature { border-top: 1px solid #DDDDDD; margin-top: 1.5em; padding-top: 1.5em; } .feature__title { color: #46545C; font-size: 15px; text-transform: uppercase; letter-spacing: 1px; } /* Element: Button */ /* ---------------------------- */ .button { display: inline-block; background: #64AEDC; color: #ffffff; text-decoration: none; line-height: 1.2em; padding: 16px 20px; border: none; border-radius: 3px; font-size: 16px; text-transform: uppercase; letter-spacing: .1em; transition: .2s; cursor: pointer; } .button:hover { background: #539ac5; } /* Element: Page Section */ /* ---------------------------- */ .page-section { border-bottom: 1px solid #DDDDDD; margin-bottom: 2em; padding-bottom: 2em; } .page-section:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; } /* Element: News Post */ /* ---------------------------- */ .news-post { background: #F5F5F5; padding: 4% 5%; cursor: pointer; font-size: 18px; border-radius: 2px; border: 1px solid #DDDDDD; margin-bottom: 1.5em; } .news-post__title { color: #1578B7; margin-bottom: .3em; } .news-post__meta { color: #777777; } .news-post__readmore { color: #1578B7; text-decoration: underline } /* Element: Form */ /* ---------------------------- */ .form { background: #F5F5F5; padding: 4% 5%; border-radius: 2px; border: 1px solid #DDDDDD; max-width: 600px; } .form__field { margin-bottom: 1em; } .form__label { margin-bottom: 0.1em; display: block; } .form__label--inline { display: inline; } /* STRUCTURE: Site Header */ /* ---------------------------- */ .site-header { background: #F5F5F5; color: #46545C; /* Dark blue-gray */ border-bottom-width: 1px; border-style: solid; border-color: #D8D8D8; } /* STRUCTURE: Masthead; */ /* ---------------------------- */ .site-masthead { overflow: hidden; } .site-masthead__title { width: 172px; padding: 18px; float: left; margin: 0; } .site-masthead__title .site-title__slogan { display: none; } .site-masthead__trigger { float: right; } /* STRUCTURE: Site Navigation */ /* ---------------------------- */ .site-nav { padding: 1em 0 2em; display: none; } .site-nav--active { display: block; } .site-nav__title { display: none; } .site-nav__menu { margin-bottom: 2.5em; } .site-nav__features { padding: 0 18px; } /* STRUCTURE: Content */ /* ---------------------------- */ .content { background: #FFFFFF; } .page-title { font-size: 36px; color: #5096C2; } /* SECTION: Highlight */ /* ---------------------------- */ .highlight { font-family: 'Ubuntu', 'Source Sans Pro', Helvetica, Arial, sans-serif; font-size: 24px; font-weight: 300; background: #46545C; color: #FFFFFF; } /* STRUCTURE: Site Footer */ /* ---------------------------- */ .site-footer { } /* STRUCTURE: Footer Nav */ /* ---------------------------- */ .footer-nav { background: #222222; padding: 1.5em 0; color: #EEEEEE; } .footer-nav a { color: #EEEEEE; } .footer-nav__menu { margin-bottom: 1em; } .footer-nav__social { margin-bottom: .5em; } /* STRUCTURE: Footer Copyright */ /* ---------------------------- */ .footer-copyright { font-family: 'Ubuntu', 'Source Sans Pro', Helvetica, Arial, sans-serif; font-size: 14px; background: #FFFFFF; padding: 1.5em 0; text-align: center; font-weight: 600; } /* Media Queries */ /* ---------------------------- */ /* Medium Size */ @media screen and (min-width: 32em) { .container { padding: 0 36px; max-width: 100%; } } /* Large Size */ @media screen and (min-width: 54em) { body { font-size: 20px; } .container { padding: 0 48px; max-width: 90%; } .container--main { display: flex; } .section { padding: 48px 0; } .site-header { float: left; width: 360px; min-width: 360px; z-index: 1000; border-bottom-width: 0; border-right-width: 1px; } .site-masthead__title { width: 100%; padding: 38px 48px 24px; float: left; margin: 0; } .site-masthead__title .site-title__slogan { display: block; } .site-masthead__trigger { display: none; } .site-nav { display: block; } .site-menu__item a { padding: 8px 0px 0px 60px; font-size: 90%; } .site-menu__item--current a:before { top: 20px; } .site-nav__features { padding: 0 40px; } .content { flex: auto; width: calc(100% - 360px); float: right; } .content .container { padding: 0 0 0 100px; margin: 0; } .highlight { clear: both; text-align: center; padding: 2.5em 0; } .highlight__text { line-height: 1.8em; } .highlight .container { max-width: 40em; } .site-footer { text-align: center; } .footer-nav { padding: 1.5em; } .footer-menu__item { display: inline-block; padding: 3px 1.5%; } .social-menu__item { margin: 0 .5%; } } } /* Extra Large Size */ @media screen and (min-width: 78em) { .container { padding: 0 48px; max-width: 90%; } } /* ELEMENT: Table */ /* ---------------------------- */ .centered { text-align: center; } .tlist { width: 100%; border-collapse: collapse; } .tlist tbody tr { border: 1px solid #e8e8e8; width: 100%; } .tlist tbody td { border: 1px solid #e8e8e8; padding: 5px; } /******************************************************************************* * Style Slurm page links ******************************************************************************/ /* Add padding between item and link */ .slurm_link { padding: 0 0 0 10px; } .slurm_link, .slurm_link:visited { outline: none; color: #e2e6e9; text-decoration: none; } .slurm_link:hover { color: #46545C; } .slurm_link:active, .slurm_link:focus { color: #8b9da7; } /* * When hovering over these tags, target direct descendants with .slurm_link * and add in a visible link icon */ h1 > .slurm_link::after, h2 > .slurm_link::after, h3 > .slurm_link::after, h4 > .slurm_link::after, h5 > .slurm_link::after { content: "§"; } dt:hover > .slurm_link::after { content: "§"; }