/* ---------- OFFICIAL CAMPUS BRAND GOOGLE FONTS ---------- */ @import url('https://fonts.googleapis.com/css2?family=Fjalla+One&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,300;0,400;0,700;0,800;1,200;1,300;1,400;1,700;1,800&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;0,900;1,300;1,400;1,700;1,900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Source+Serif+Pro:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap'); /* ---------- ALL DEFAULT STYLES FOR SMALL SCREENS ARE PROGRESSIVELY ENHANCED FOR LARGER SCREENS VIA MEDIA QUERIES NEAR BOTTOM OF THIS FILE ---------- */ /* ---------- SITEWIDE DEFAULT STYLES ---------- */ html { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } body, html { width: 100%; } body { font-family: 'Source Sans Pro', Helvetica, sans-serif; color: #333; background-color: #fff; border-top: 7px solid #ff552e; } a { color: #555; text-decoration: none; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a:hover, a:focus { color: #333; } a span.pdf { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/pdf.png") no-repeat center; text-indent: -999em; } a span.doc { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/doc.png") no-repeat center; text-indent: -999em; } a span.xls { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/xls.png") no-repeat center; text-indent: -999em; } a span.ppt { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/ppt.png") no-repeat center; text-indent: -999em; } a span.vid { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/vid.png") no-repeat center; text-indent: -999em; } a span.new-window { margin: 0; padding: 0; width: 16px; height: 16px; display: inline-block; background: transparent url("../images/new-window.png") no-repeat center; text-indent: -999em; } strong { font-weight: bold; } em { font-style: italic; } sup { margin-top: -.375em; font-size: .625em; display: inline-block; vertical-align: top; } .clear { clear: both; float: none; } .center { text-align: center; } .strong { font-weight: bold; } .italic { font-style: italic; } .quote { margin-left: 1em; padding-left: 1em; border-left: 3px double #999; } .uppercase { text-transform: uppercase; } .inline { display: inline; } .inline-block { display: inline-block; } .floatleft { float: left; } a#skip-link, h2, #content .offscreen { margin-left: -9999em; position: absolute; } /* ---------- DEFAULT HEADER, ODOS LOGO, COLUMN I LOGO, AND UI LINK STYLES ---------- */ #header { margin: 0; padding: 0; width: 100%; } #header .container { margin: 0 0 0 1.25em; padding: 0; } p#illinois { margin: .3125em 0 0; padding: 0; font-family: 'Montserrat', Helvetica, sans-serif; font-size: .7125em; color: #13294b; font-weight: 700; text-transform: uppercase; letter-spacing: .1325em; } p#illinois a { color: #13294b; } p#block-i { margin: 1.5875em 1.5em 1.5875em 0; padding: 0; width: 1.85em; height: auto; float: left; } #unit-container { margin: .875em 0 0; padding: .0625em 0 .0625em 1em; width: 63%; border-left: 1px solid #13294b; float: left; } #unit-container p { margin: 0; padding: 0; color: #13294b; } #unit-container p a { color: #13294b; } p#student-affairs { margin-bottom: .25em; font-size: .875em; font-weight: 400; } p#unit-head { font-size: 1.5em; font-weight: 600; } /* ---------- DEFAULT GOOGLE SEARCH STYLES ---------- */ #google { margin: 0; padding: .75em 1em; width: 100%; font-family: 'Source Sans Pro', sans-serif; background-color: #e8e9eb; display: block; border-bottom: 1px solid #999; } #google form { margin: 0; padding: 0; } #google form input { margin: 0; padding: 0; font-size: 1em; font-weight: normal; float: left; border-radius: 0; -webkit-appearance: none; } #google form input#gsc-i-id1 { margin: 0; padding: .5em; width: 80%; height: auto; outline: none; background-color: #fff; border: 1px solid #666; border-right: none; } #google form input#gsc-i-id1:focus { background: rgba(255, 255, 255, 1.0); outline: 2px solid #21759b; } #google form input#submit { margin: 0; padding: .5em; width: 20%; height: auto; background-color: #ff552e; color: #fff; border: 1px solid #666; } #google form input#submit:hover, #google form input#submit:focus { background-color: #333; } #google form input#submit:focus { outline: 2px solid #21759b; } /* ---------- DEFAULT BREADCRUMB NAVIGATION STYLES ---------- */ #content #crumbnav { margin: 0; padding: .5em 1em; width: 100%; color: #ff552e; border-top: 1px solid #999; border-bottom: 1px solid #999; } #content #crumbnav ol { margin: 0; padding: 0; list-style-type: none; } #content #crumbnav ol li { margin: 0 .75em 0 0; padding: 0 1.5em 0 0; font-size: .75em; text-transform: uppercase; display: inline-block; background: url("../images/crumb_arrow.gif") no-repeat center right; background-size: .75em auto; /* border-right: 3px double #999; */ } #content #crumbnav ol li:last-child { margin: 0; padding: 0; background-image: none; /* border: none; */ } #content #crumbnav ol li a { color: #666; } #content #crumbnav ol li a:hover, #content #crumbnav ul li a:focus { color: #333; } #content #crumbnav ol li a:focus { outline: 2px solid #21759b; } /* ---------- DEFAULT CONTENT AREA STYLES ---------- */ #content { margin: 0; padding: 0; width: 100%; } body.texture #content { margin-top: 1em; } #content .container { margin: 0; padding: 0; width: 100%; } #content #pagetitle { margin: 0; padding: 1.5em 1em 0; } #content #pagetitle h1 { margin: 0 0 .5em; padding: 0; font-family: 'Montserrat', Helvetica, sans-serif; font-size: 2.5em; font-weight: 400; color: #333; text-transform: uppercase; } #content #pagetitle h1 span { margin: 0; padding: .125em .5em; font-family: 'Source Sans Pro', Helvetica, sans-serif; font-weight: normal; background-color: #333; color: #fff; font-variant: normal; text-transform: uppercase; display: inline-block; position: relative; border: 1px solid #333; border-radius: .125em; } #content #pagetitle p { margin-bottom: 1em; } #content ul#secondnav { margin: 0 -1em; padding: 0; background-color: transparent; list-style-type: none; } #content ul#secondnav li { margin: 0; padding: 0; border-top: 1px solid #fff; } #content ul#secondnav li:first-child { margin-top: 1em; } #content ul#secondnav li a { margin: 0; padding: 1em 2em; background-color: #ff552e; color: #fff; text-decoration: none; display: block; } #content ul#secondnav li a:hover, #content ul#secondnav li a:focus { background-color: #bbb; color: #000; text-decoration: underline; } #content ul#secondnav li a:focus { outline: 2px solid #21759b; } #content ul#secondnav li a span { margin: -.25em 0; padding: .75em .625em; width: 2em; height: 2em; background-color: #555; display: inline-block; float: right; } #content ul#secondnav li a:hover span, #content ul#secondnav li a:focus span { background-color: #333; } #content ul#secondnav li a span span { margin: 0; padding: 0; width: 0; height: 0; border-right: 5px solid transparent; border-left: 5px solid transparent; border-top: 5px solid #fff; } #content section { margin: 0; padding: 0; width: 100%; border-bottom: 1px solid #999; } #content section.brown { background-color: #cdc8b4; border-bottom: 1px solid #999; } #content section.tan { background-color: #e9e7de; border-bottom: 1px solid #999; } #content section.grey { background-color: #ccc; border-bottom: 1px solid #999; } #content section.darkgrey { background-color: #999; border-bottom: 1px solid #999; } #content section.orange { background-color: #ff552e; border-bottom: 1px solid #999; } #content section.blue { background-color: #13294B; border-bottom: 1px solid #999; } #content section.white { background-color: #fff; border-bottom: 1px solid #999; } #content section.red { background-color: #c00; border-bottom: 1px solid #999; } #content section.darkgrey h3, #content section.darkgrey h4, #content section.darkgrey h5, #content section.darkgrey p, #content section.darkgrey li, #content section.orange h3, #content section.orange h4, #content section.orange h5, #content section.orange p, #content section.orange li, #content section.blue h3, #content section.blue h4, #content section.blue h5, #content section.blue p, #content section.blue li, #content section.red h3, #content section.red h4, #content section.red h5, #content section.red p, #content section.red li { color: #fff; } #content section.darkgrey a, #content section.orange a, #content section.blue a, #content section.red a { color: #fff; } #content section.darkgrey a:hover, #content section.darkgrey a:focus, #content section.orange a:hover, #content section.orange a:focus, #content section.blue a:hover #content section.blue a:focus, #content section.red a:hover, #content section.red a:focus { color: #ddd; } #content section div.sectionitem { margin: 0; padding: 2em 1em; width: 100%; } #content h3 { margin: 1em 0 0; padding: 0; width: 100%; font-family: 'Montserrat', Helvetica, sans-serif; font-size: 1.625em; font-weight: 400; text-transform: uppercase; color: #333; } #content h4 { margin: 1em 0 0; font-size: 1em; font-weight: bold; line-height: 1.5em; } #content h5 { margin: 2em 0 0; font-size: 1em; font-weight: bold; line-height: 1.5em; color: #13294B; } #content h6 { margin: 2em 0 0; font-size: 1em; font-weight: bold; line-height: 1.5em; color: #333; } #content p { margin: 1em 0 0; font-size: 1em; line-height: 1.5em; } #content ul { margin: 1em 0 0 1em; list-style-type: square; } #content ul ul { list-style-type: circle; } #content ol { margin: 1em 0 0 1em; list-style-type: decimal; } #content li { margin: 0; font-size: 1em; line-height: 1.5em; } #content li ul, #content li ol { margin: 0 0 0 2em; } #content li li { font-size: 100%; } #content ul.space li, #content ol.space li { margin-bottom: 1em; } #content table td, #content table th { margin: 0; padding: 0; font-size: 1em; line-height: 1.5em; } #content form input { margin: 0; padding: 0; font-size: 1em; line-height: 1.5em; } #content a { text-decoration: underline; } #content a:hover, #content a:focus { color: #000; } #content a:focus { background-color: #eee; outline: 2px solid #21759b; } #content p.largetext { margin: 1em 1em 0; font-size: 1.125em; color: #13294B; text-align: justify; } #content p.largetext2 { margin: 1em 0 0; font-size: 1.125em; color: #13294B; text-align: justify; } #content ul.overview { margin: 1em 3em 0; } #content .notebox { margin: 2em 0 0; padding: .5em 1em 1em; border: 1px solid #999; } #content a.block { margin: 0; padding: .5em 1em; background-color: transparent; display: inline-block; border: 1px solid #999; text-decoration: none; } #content a.block:hover, #content a.block:focus { background-color: #ddd; text-decoration: underline; } #content a.button { margin: 2em auto; padding: .5em 1em; width: 18em; background-color: #ff552e; color: #fff; text-align: center; display: block; border: 1px solid #000; text-decoration: none; } #content a.button:hover, #content a.button:focus { background-color: #333; color: #ddd; text-decoration: underline; } #content a img { opacity: 1.0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 hack */ filter: alpha(opacity = 100); /* IE 5-7 hack */ -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #content a:hover img, #content a:focus img { opacity: .80; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE 8 hack */ filter: alpha(opacity = 80); /* IE 5-7 hack */ } #content img.responsive-image { margin: 1em 0 0; padding: 0; width: 100%; height: auto; border: 1px solid #999; } .responsive-video { margin: 1em 0 0; position: relative; height: 0; overflow: hidden; } /* 16x9 Aspect Ratio */ .responsive-video-16x9 { padding-bottom: 56.25%; } /* 4x3 Aspect Ratio */ .responsive-video-4x3 { padding-bottom: 75%; } .responsive-video iframe { position: absolute; top:0; left: 0; width: 100%; height: 100%; } #content ul.socialmedia { margin: 1em 0; padding: 0; list-style-type: none; } #content ul.socialmedia li { margin: 0 .5em 0 0; padding: 0; display: inline-block; } #content ul.socialmedia li:last-child { margin: 0; } #content ul.socialmedia li a span { margin-left: -999em; position: absolute; } #content ul.socialmedia li a { margin: 0; padding: 0; width: 1.5em; height: 1.5em; display: block; text-align: center; } #content ul.socialmedia li a svg { height: 1.5em; } /* ---------- DEFAULT BACK TO TOP BUTTON STYLES ---------- */ #content a.back-to-top { padding: 1em; font-size: .75em; text-decoration: none; background-color: #333; background: rgba(0, 0, 0, 0.70); color: #666; border: none; display: none; position: fixed; bottom: 20%; right: 1em; z-index: 5; } #content a.back-to-top span.hide { margin-left: -999em; position: absolute; } #content a.back-to-top:hover { background-color: #666; background: rgba(0, 0, 0, 1.0); } #content a.back-to-top span.arrow { margin: 0 auto .5em; width: 0; height: 0; border-left: 1em solid transparent; border-right: 1em solid transparent; border-bottom: 1em solid #bbb; display: block; } #content a.back-to-top:hover span.arrow { border-bottom: 1em solid #ddd; } /* ---------- DEFAULT SHOW HIDE STYLES ---------- */ #content dl.faq { margin: 1em -1em 0; padding: 0; } #content dl.faq dt { margin: -1px 0 0; padding: .25em 1em 1em 2.5em; font-size: .9em; line-height: 1.25em; font-weight: bold; border-top: 1px solid #999; border-bottom: 1px solid #999; cursor: pointer; } #content dl.faq dd { margin: 0; padding: 0 1em 1em 2.25em; } #content dl.faq dd p { margin: 1em 0 0; font-size: .9em; line-height: 1.5em; } /* ---------- DEFAULT UNIT NAVIGATION STYLES (SECONDARY NAVIGATION) ---------- */ #content nav#unit-nav h3 { margin-left: -9999em; position: absolute; } /* #content nav#unit-nav h3 { margin: 1em 0; padding: 0 0 .5em; font-family: Helvetica, Arial, sans-serif; font-size: .9em; font-weight: bold; line-height: 1.5em; text-transform: none; letter-spacing: normal; } */ #content nav#unit-nav ul { margin: 0 -1em; padding: 0; list-style-type: none; } #content nav#unit-nav ul ul { margin: 0; } #content nav#unit-nav ul li.first { margin-top: -1.1875em; } #content nav#unit-nav li a { margin: -1px 0 0; padding: .5em 1em .5em 1.5em; text-decoration: none; background-color: #ddd; display: block; border-top: 1px solid #999; border-bottom: 1px solid #999; } #content nav#unit-nav li a:hover, #content nav#unit-nav li a:focus { background-color: #bbb; text-decoration: underline; } #content nav#unit-nav li a.active, #content nav#unit-nav li a.active:hover, #content nav#unit-nav li a.active:focus { background-color: #ff552e; color: #fff; } #content nav#unit-nav li li { font-size: 100%; } #content nav#unit-nav li li a { padding: .5em 1em .5em 3.5em; background-color: #fff; } #content nav#unit-nav li li a:hover, #content nav#unit-nav li li a:focus { background-color: #eee; } #content nav#unit-nav p { margin-left: .5em; } /* ---------- DEFAULT IMAGE SLIDER STYLES ---------- */ body#home #content section#feature { margin: 16em .5em 0; padding: .5em; width: auto; background-color: #333; } body.slider #content section#slider { margin: 0 .5em; padding: .5em; width: auto; background-color: #333; } body.slider #content #slider .container { padding: 1em 0; } body#home #content section#feature ul, body#home #content section#feature li, body#slider #content section.photo-slider ul, body#slider #content section.photo-slider li { margin: 0; padding: 0; list-style-type: none; } body#home #content section#feature a, body#slider #content section.photo-slider a { border: none; } body#home #content section#feature .slider__arrows a:focus, body#home #content section#feature .slider__item a:focus, body#slider #content section.photo-slider .slider__arrows a:focus, body#slider #content section.photo-slider .slider__item a:focus { outline: none; background-color: transparent; } .slider__nav-item { width: 2em; height: .25em; margin: .25em .25em 0; } .slider__arrows { display: none; } /* ---------- DEFAULT HOME PAGE SPECIFIC STYLES ---------- */ body#home #content { } body#home #content h1 { margin-left: -9999em; position: absolute; } body#home #content .container { background-color: transparent; } body#home #content section { margin: 0; padding: 0; width: 100%; background-color: transparent; } body#home #content section#featurebar { margin: 0; padding: 1em 1em 1px; background-color: #cdc8b4; } body#home #content section#featurebar ul { margin: 0; padding: 0; list-style-type: none; } body#home #content section#featurebar li { margin: 0; padding: 0; } body#home #content section#featurebar li a { margin: 0 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#featurebar li a.blue { background: #13294b url("../images/promos/bg-blue.jpg") repeat center; } body#home #content section#featurebar li a.orange { background: #ff552e url("../images/promos/bg-orange.jpg") repeat center; } body#home #content section#featurebar li a.white { background: #fff url("../images/promos/bg-white.jpg") repeat center; } body#home #content section#featurebar li a.grey { background: #444 url("../images/promos/bg-grey.jpg") repeat center; } body#home #content section#featurebar li a.blue:hover, body#home #content section#featurebar li a.orange:hover, body#home #content section#featurebar li a.white:hover, body#home #content section#featurebar li a.grey:hover, body#home #content section#featurebar li a.blue:focus, body#home #content section#featurebar li a.orange:focus, body#home #content section#featurebar li a.white:focus, body#home #content section#featurebar li a.grey:focus { background-image: none; } body#home #content section#featurebar li a span.orange { color: #ff552e; } body#home #content section#featurebar li a span.blue { color: #13294b; } body#home #content section#featurebar li a span.white { color: #fff; } body#home #content section#featurebar li a span.small-text { margin-top: .125em; font-size: 1.25em; text-transform: uppercase; } body#home #content section#featurebar li a span.large-text { margin-top: .125em; font-family: 'Fjalla One', Helvetica, Arial, sans-serif; font-size: 2em; display: block; text-transform: uppercase; } body#home #content section#featurebar li a:hover span.large-text, body#home #content section#featurebar li a:focus span.large-text { text-decoration: underline; } body#home #content section#featurebar body#home #content section#featurebar li a img { margin: 0 0 1em; padding: 0; width: 100%; } /* ---------- DEFAULT FOOTER AREA STYLES ---------- */ #footer { margin: 0; padding: 0; background-color: #13294b; } #footer .container { margin: 0; padding: 1em; } #footer .col_1_4, #footer .col_2_4 { margin: 0; padding: 1em 0; } #footer h3, #footer h4, #footer p, #footer li, #footer a { color: #fff; font-size: 1em; line-height: 1.125em; } #footer h3, #footer h4 { font-size: 1.125em; line-height: 1.25em; font-weight: bold; } #footer h4.internal { margin-top: 1.5em; } #footer p { margin-bottom: 1em; } #footer a { text-decoration: underline; } #footer a:hover, #footer a:focus { color: #ff552e; } #footer ul { margin: .5em 0 0; list-style-type: none; border-bottom: 1px solid #4d69a0; } #footer li { margin: 0; padding: 0; border-top: 1px solid #4d69a0; } #footer li a { padding: .5em 1em; display: block; text-decoration: none; } #footer li a:hover, #footer li a:focus { text-decoration: underline; } p#il-wordmark { margin: 1em 0 2em; padding: 0; width: 16em; height: auto; } #footer ul#socialnav { margin: 2em 0; padding: 0; list-style-type: none; border: none; } #footer ul#socialnav li { margin: 0 1em 0 0; padding: 0; display: inline-block; border: none; } #footer ul#socialnav li:last-child { margin: 0; } #footer ul#socialnav li a span { margin-left: -999em; position: absolute; } #footer ul#socialnav li a { margin: 0; padding: 0; width: 1em; height: 1em; display: block; text-align: center; } #footer ul#socialnav li a svg { height: 1em; } #footer ul#socialnav li a:hover, #footer ul#socialnav li a:focus { } #smalltext { margin: 2em 0; 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) { #header { } #header .container { } #navigation li#searchnav { padding: 0; width: 18em; position: absolute; top: -4em; right: 0; } #navigation li#searchnav #google { margin: 0; padding: 0; background-color: transparent; border: none; } #unit-container { margin: 1.25em 0 0; padding: .5em 0 .5em 1em; } #content { margin-top: 28em; } body.texture #content { margin-top: 2.875em; } #content #pagetitle { } #content #pagetitle h1 { margin-bottom: 0; } #content #pagetitle p { margin-bottom: 0; } #content ul#secondnav { margin: 1em 0 0; padding: 0; } #content ul#secondnav li { margin: 0 1em 1em 0; padding: 0; float: left; border: none; } #content ul#secondnav li:first-child { margin-top: 0; } #content ul#secondnav li:last-child { border: none; } #content ul#secondnav li a { margin: 0; padding: .5em 1em; display: block; border: 1px solid #333; } #content ul#secondnav li a:hover, #content ul#secondnav li a:focus { text-decoration: underline; border-color: #000; } #content ul#secondnav li a span { display: none; } #content section div.sectionitem { } #content .sectionhead { margin: 0; padding: 2em 1em 1em; width: 33.3333333%; float: left; } #content .col_1_4 { margin: 0; padding: 1em; width: 25%; float: left; } #content .col_2_4 { margin: 0; padding: 1em; width: 50%; float: left; } #content .col_3_4 { margin: 0; padding: 1em; width: 75%; float: left; } #content .col_1_3 { margin: 0; padding: 1em; width: 33.3333333%; float: left; } #content .col_2_3 { margin: 0; padding: 1em; width: 66.6666666%; float: left; } #content .col_3_3 { margin: 0; padding: 1em; width: 100%; } #content h3 { margin: 0; padding: 0; font-size: 1.5em; line-height: 1.25em; background-color: transparent; text-align: left; } #content h3.top-space { margin-top: 2em; } #content p.largetext { margin: 1em 2em 0; font-size: 1.5em; } #content p.largetext2 { margin: 0 0 1em; font-size: 1.5em; } #content ul.overview { margin: 1em 5em 0; } #content .notebox { margin: 1em 0; padding: 0 1em 1em; } #content dl.faq { margin: 1em 0 0; } #content nav#unit-nav h3 { } #content nav#unit-nav ul { margin: 1em 0 0; } #content nav#unit-nav ul li.first { margin-top: 0; } #content nav#unit-nav ul li a { background-color: transparent; } #content nav#unit-nav ul li a:hover, #content nav#unit-nav ul li a:focus { background-color: #ddd; } #content nav#unit-nav p { margin-left: 1.5em; } body#home #content { margin-top: 24em; } body#home #content section#feature { margin: -4em auto 0; padding: 1em; width: 80%; border: none; } .slider__nav-item { width: 2em; height: .25em; margin: .25em .25em 0; } .slider__arrows { display: block; } .slider__arrows-item--left span.arrow { margin: -1em 0 0; width: 0; height: 0; border-top: 1em solid transparent; border-bottom: 1em solid transparent; border-right: 1em solid #333; display: block; position: relative; } .slider__arrows-item--left span.arrow:hover { border-right: 1em solid #ff552e; } .slider__arrows-item--right span.arrow { margin: -1em 0 0; width: 0; height: 0; border-top: 1em solid transparent; border-bottom: 1em solid transparent; border-left: 1em solid #333; display: block; position: relative; } .slider__arrows-item--right span.arrow:hover { border-left: 1em solid #ff552e; } body#home #content section#featurebar { padding: 1em 0 0 2%; } body#home #content section#featurebar li { margin: 0 2% 0 0; width: 31.3333333%; float: left; } body#home #content section#featurebar li a span.large-text { } #footer .container {} #footer .col_1_4 { margin: 0; padding: 1em; width: 25%; float: left; } #footer .col_2_4 { margin: 0; padding: 1em; width: 50%; float: left; } } /*/mediaquery*/ /* Desktops and laptops ---------- */ @media only screen and (min-width: 1224px) { #header .container { margin: 0 10%; width: 80%; } #content #crumbnav { padding: .5em 10%; } #content { margin-top: 34em; } body.texture #content { } #content #pagetitle { padding: 1.5em 10% 0; } #content .container, #content section div.sectionitem { margin: 0 10%; width: 80%; } #content section div.sectionitem { } body#home #content { margin-top: 24em; } body#home #content section#featurebar li a span.large-text { } #footer .container { margin: 0 10%; width: 80%; } } /*/mediaquery*/ /* Desktops and laptops ---------- */ @media only screen and (min-width: 1350px) { #header h2#illinois span { margin-left: 0; position: static; } body#home #content section#featurebar li a span.small-text { margin-top: .25em; font-size: 1.5em; } body#home #content section#featurebar li a span.large-text { margin-top: .25em; font-size: 2.25em; } } /*/mediaquery*/