/* ---------- SITEWIDE GENERAL DEFAULT STYLES LOCATED AT ODOS.ILLINOIS.EDU/STYLES/STYLES.CSS ---------- */

/* ---------- ALL DEFAULT STYLES FOR SMALL SCREENS ARE PROGRESSIVELY ENHANCED FOR LARGER SCREENS VIA MEDIA QUERIES NEAR BOTTOM OF THIS FILE  ---------- */

/* ---------- OSCR BODY BACKGROUND IMAGE OVERRIDES FOR ODOS DEFAULT STYLES ---------- */

body.home { background: url("../images/bg/small/alma.jpg") no-repeat center 5em; background-size: 100% auto; }
body.about { background: url("../images/bg/small/about.jpg") no-repeat center 5em; background-size: 100% auto; }
body.involved { background: url("../images/bg/small/involved.jpg") no-repeat center 5em; background-size: 100% auto; }
body.alternative { background: url("../images/bg/small/alternative.jpg") no-repeat center 5em; background-size: 100% auto; }
body.policies { background: url("../images/bg/small/policies.jpg") no-repeat center 5em; background-size: 100% auto; }
body.resources { background: url("../images/bg/small/resources.jpg") no-repeat center 5em; background-size: 100% auto; }
body.faq { background: url("../images/bg/small/faq.jpg") no-repeat center 5em; background-size: 100% auto; }

body.texture { background: url("../images/bg/texture/texture1.jpg") repeat-x top center; background-size: auto; }


/* ---------- DEFAULT HEADER, OSCR LOGO, COLUMN I LOGO, AND UI LINK STYLES ---------- */

#header .container {  }


/* ---------- DEFAULT MAIN NAVIGATION STYLES ---------- */

/* SET CURRENT ACTIVE PAGE LINK COLOR IN MAIN NAV BAR */
body.home #navigation .nav-collapse li#gohome a, 
body.about #navigation .nav-collapse li#about a, 
body.involved #navigation .nav-collapse li#involved a, 
body.alternative #navigation .nav-collapse li#alternative a, 
body.policies #navigation .nav-collapse li#policies a, 
body.resources #navigation .nav-collapse li#resources a, 
body.faq #navigation .nav-collapse li#faq a 
{ color: #fff; background-color: #e84a27; }

#navigation .nav-collapse li a br { display: none; }

#navigation .nav-collapse li a span.lcase { margin: 0; padding: 0; text-transform: lowercase; border: none; display: inline; position: static; }


/* MULTIPLE LEVELS */

body.about #navigation .nav-collapse li#about li a, 
body.involved #navigation .nav-collapse li#involved li a, 
body.policies #navigation .nav-collapse li#policies li a, 
body.resources #navigation .nav-collapse li#resources li a, 
body.faq #navigation .nav-collapse li#faq li a 
{ padding-left: 4em; background-color: #fff; color: #333; }

body.about #navigation .nav-collapse li#about li a:hover, 
body.involved #navigation .nav-collapse li#involved li a:hover, 
body.policies #navigation .nav-collapse li#policies li a:hover, 
body.resources #navigation .nav-collapse li#resources li a:hover, 
body.faq #navigation .nav-collapse li#faq li a:hover, 
body.about #navigation .nav-collapse li#about li a:focus, 
body.involved #navigation .nav-collapse li#involved li a:focus, 
body.policies #navigation .nav-collapse li#policies li a:focus, 
body.resources #navigation .nav-collapse li#resources li a:focus, 
body.faq #navigation .nav-collapse li#faq li a:focus 
{ background-color: #bbb; color: #000; }


/* ---------- DEFAULT CONTENT AREA STYLES ---------- */

#content #pagetitle h1 span { margin: 0; padding: 0; font-family: 'Josefin Sans', Helvetica, Arial, sans-serif; font-weight: 400; letter-spacing: .0625em; background-color: transparent; color: #333; text-transform: lowercase; display: inline; position: static; border: none; }

/* ---------- DEFAULT FEATURE IMAGE STYLES [HOME PAGE] ---------- */

body#home #content section#feature { margin: -2em .5em 0; padding: .5em; width: auto; background-color: #333; }
body#home #content section#feature .item { background-color: #fff; }
body#home #content section#feature img { margin: 2.5%; padding: 0; width: 95%; height: auto; border: 1px solid #ccc; }
body#home #content section#feature a { border: none; }
body#home #content section#feature span { margin-left: -999em; position: absolute; }


/* ---------- DEFAULT HOME PAGE SPECIFIC STYLES ---------- */

body#home #content section#welcome { margin: 0; padding: 2em 1em; width: 100%; background-color: #fff; background: rgba(255, 255, 255, 0.8); border-top: 1px solid #999; }
body#home #content section#welcome h2 { margin-left: -999em; position: absolute; }
body#home #content section#welcome h3 { margin-top: 1em; }
body#home #content section#welcome p.largetext2 { margin-top: 0; }

body#home #content section#welcome .col_1_3 ul { margin: 0; padding: 0; list-style-type: none; }
body#home #content section#welcome .col_1_3 li { margin: 0; padding: 0; }
body#home #content section#welcome .col_1_3 li a { margin: 2em 0 1em; padding: 2em 1em; width: 100%; height: auto; display: block; text-align: center; text-decoration: none; border: 1px solid #999; }
body#home #content section#welcome .col_1_3 li a.blue { background: #13294b url("http://odosdev.illinois.edu/images/promos/bg-blue.jpg") repeat center; }
body#home #content section#welcome .col_1_3 li a.orange { background: #e84a27 url("http://odosdev.illinois.edu/images/promos/bg-orange.jpg") repeat center; }
body#home #content section#welcome .col_1_3 li a.white { background: #fff url("http://odosdev.illinois.edu/images/promos/bg-white.jpg") repeat center; }
body#home #content section#welcome .col_1_3 li a.grey { background: #444 url("http://odosdev.illinois.edu/images/promos/bg-grey.jpg") repeat center; }
body#home #content section#welcome .col_1_3 li a.blue:hover, 
body#home #content section#welcome .col_1_3 li a.orange:hover, 
body#home #content section#welcome .col_1_3 li a.white:hover, 
body#home #content section#welcome .col_1_3 li a.grey:hover, 
body#home #content section#welcome .col_1_3 li a.blue:focus, 
body#home #content section#welcome .col_1_3 li a.orange:focus, 
body#home #content section#welcome .col_1_3 li a.white:focus, 
body#home #content section#welcome .col_1_3 li a.grey:focus 
{ background-image: none; }
body#home #content section#welcome .col_1_3 li a span.orange { color: #e84a27; }
body#home #content section#welcome .col_1_3 li a span.blue { color: #13294b; }
body#home #content section#welcome .col_1_3 li a span.white { color: #fff; }
body#home #content section#welcome .col_1_3 li a span.small-text { margin-top: .125em; font-family: Helvetica, Arial, sans-serif; font-size: 1.25em; }
body#home #content section#welcome .col_1_3 li a span.large-text { margin-top: .125em; font-family: 'Josefin Sans', Helvetica, Arial, sans-serif; font-size: 2em; font-weight: 700; display: block; text-transform: uppercase; }
body#home #content section#welcome .col_1_3 li a:hover span.large-text, 
body#home #content section#welcome .col_1_3 li a:focus span.large-text 
{ text-decoration: underline; }

body#home #content section#we-care a { margin: 0; padding: 1em 0; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 1.25em; line-height: 1.75em; text-transform: uppercase; text-decoration: none; text-align: center; background-color: #13294B; color: #e84a27; display: block; }
body#home #content section#we-care a span { font-size: 2.5em; font-weight: bold; color: #fff; display: block; }
body#home #content section#we-care a span.tag { font-size: .75em; font-style: italic; font-weight: normal; text-transform: none; }
body#home #content section#we-care a:hover, body#home #content section#we-care a:focus { background-color: #1b3a60; }
body#home #content section#we-care a:hover span, 
body#home #content section#we-care a:focus span 
{ text-decoration: underline; }
body#home #content section#we-care a:hover span.tag, 
body#home #content section#we-care a:focus span.tag 
{ text-decoration: none; }


/* ---------- DEFAULT STUDENT DISCIPLINARY PROCEDURES SPECIFIC STYLES ---------- */

#content div.section { padding-top: 1em; }
#content div.section h4 { padding: 1em; border-top: 1px solid #999; border-bottom: 1px solid #999; }

#content div#table-of-contents { padding-top: 2em; }


/* ---------- DEFAULT FOOTER AREA STYLES ---------- */

#footer h3 a { font-size: .875em; }














/* ---------- THE FOLLOWING STYLES EITHER ENHANCE OR OVERRIDE THE STYLES LISTED ABOVE FOR SMALLER SCREENS ---------- */















/* Tablets and larger ---------- */
@media only screen and (min-width: 768px) {

body.home { background: url("../images/bg/mid/alma.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.about { background: url("../images/bg/mid/about.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.involved { background: url("../images/bg/mid/involved.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.alternative { background: url("../images/bg/mid/alternative.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.policies { background: url("../images/bg/mid/policies.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.resources { background: url("../images/bg/mid/resources.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }
body.faq { background: url("../images/bg/mid/faq.jpg") no-repeat center 5.5em fixed; background-size: 100% auto; }

body.texture { background: url("../images/bg/texture/texture1.jpg") repeat-x top center fixed; }

#header .container {  }

#navigation .nav-collapse li#about { width: 11%; }
#navigation .nav-collapse li#involved { width: 13%; border-left: 1px solid #999; border-right: 1px solid #999; }
#navigation .nav-collapse li#alternative { width: 25%; }
#navigation .nav-collapse li#policies { width: 20%; border-left: 1px solid #999; border-right: 1px solid #999; } 
#navigation .nav-collapse li#resources { width: 20%; }
#navigation .nav-collapse li#faq { width: 11%; border-left: 1px solid #999; }

#navigation .nav-collapse li a br { display: block; }

#navigation .nav-collapse ul li#about:hover > ul, 
#navigation .nav-collapse ul li#involved:hover > ul, 
#navigation .nav-collapse ul li#faq:hover > ul, 
#navigation .nav-collapse ul li#about.focus > ul, 
#navigation .nav-collapse ul li#faq.focus > ul 
{ width: 250%; }

#navigation .nav-collapse ul li:hover > ul#faqdrop,
#navigation .nav-collapse ul li.focus > ul#faqdrop 
{ right: .125em; }

body.about #navigation .nav-collapse li#about li a, 
body.involved #navigation .nav-collapse li#involved li a, 
body.policies #navigation .nav-collapse li#policies li a, 
body.resources #navigation .nav-collapse li#resources li a, 
body.faq #navigation .nav-collapse li#faq li a
{ padding-left: 1em; background-color: #fff; background: rgba(255, 255, 255, 0.90); }

body.about #navigation .nav-collapse li#about li a:hover, 
body.involved #navigation .nav-collapse li#involved li a:hover, 
body.policies #navigation .nav-collapse li#policies li a:hover, 
body.resources #navigation .nav-collapse li#resources li a:hover, 
body.faq #navigation .nav-collapse li#faq li a:hover, 
body.about #navigation .nav-collapse li#about li a:focus, 
body.involved #navigation .nav-collapse li#involved li a:focus, 
body.policies #navigation .nav-collapse li#policies li a:focus, 
body.resources #navigation .nav-collapse li#resources li a:focus, 
body.faq #navigation .nav-collapse li#faq li a:focus 
{ background-color: #ddd; background: rgba(225, 225, 225, 0.90); }

body.texture #content { margin-top: 13.5em; }

#content section div.sectionitem { padding: 10em 1em; }

#content section#priority-links {  }
#content section#priority-links .container { margin: 0; width: 25%; position: absolute; top: 8.5em; right: .125em; border: none; }
#content section#priority-links ul {}
#content section#priority-links li { margin: 0; padding: 0; border: 1px solid #666; border-right: none; }
#content section#priority-links li a { margin: 0; padding: .75em 1em; font-size: .75em; letter-spacing: .125em; background-color: #e84a27; background: rgba(232, 74, 39, 0.90); }
#content section#priority-links li a:hover, #content section#priority-links li a:focus { background-color: #13294B; background: rgba(51, 51, 51, 0.85); }

body#home #content section#welcome { padding: 2em 1em; }
body#home #content section#welcome h2 { font-size: 2em; }

body#home #content section#feature { margin: -4em auto 0; padding: 1em; width: 80%; border: none; }

body#home #content section#welcome .col_1_3 li a { margin: 0; }

body#home #content section#we-care a { padding-top: 1.25em; }
body#home #content section#we-care a span { margin: 0 .25em; display: inline-block; }
body#home #content section#we-care a span.tag { margin: 0; }

#content div.section { padding-top: 10em; }

#content nav#unit-nav h3 { margin-top: 10em; }
#content nav#unit-nav ul li a { background-color: #ddd; }
#content nav#unit-nav ul li a:hover, 
#content nav#unit-nav ul li a:focus 
{ background-color: #ccc; }
#content nav#unit-nav ul li li a { background-color: #fff; }
#content nav#unit-nav ul li li a:hover, 
#content nav#unit-nav ul li li a:focus
{ background-color: #eee; }

} /*/mediaquery*/















/* Desktops and laptops ---------- */
@media only screen and (min-width: 1224px) {

body.home { background: url("../images/bg/large/alma.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.about { background: url("../images/bg/large/about.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.involved { background: url("../images/bg/large/involved.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.alternative { background: url("../images/bg/large/alternative.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.policies { background: url("../images/bg/large/policies.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.resources { background: url("../images/bg/large/resources.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }
body.faq { background: url("../images/bg/large/faq.jpg") no-repeat center 6.5em fixed; background-size: 100% auto; }

body.texture { background: url("../images/bg/texture/texture1.jpg") repeat-x top center fixed; }

#header .container {  }

#navigation .nav-collapse li a br { display: none; }

#navigation .nav-collapse ul li#faq:hover > ul, 
#navigation .nav-collapse ul li#faq.focus > ul 
{  }

body.texture #content { margin-top: 14.5em; }

#content section div.sectionitem { padding: 12em 1em; }

#content section#priority-links .container { top: 9em; }

} /*/mediaquery*/