nhall

function AccessibleColor(el) {
	var backgroundRGB = el.css("backgroundColor");
	backgroundRGB = backgroundRGB.substring(backgroundRGB.length - 1, 4).replace(/\s/g, "").split(",");

	var sum = Math.round((
		(parseInt(backgroundRGB[0]) * 299) + 
		(parseInt(backgroundRGB[1]) * 587) + 
		(parseInt(backgroundRGB[2]) * 114)) / 1000);

	if (sum > 128) {

nhall

@mixin accessible-color($color: #000) {
    $red: red($color);
    $green: green($color);
    $blue: blue($color);

    color: rgb(
        (((($red * 299) + ($blue * 114) + ($green * 587)) - 128000) * -1000),
        (((($red * 299) + ($blue * 114) + ($green * 587)) - 128000) * -1000),
        (((($red * 299) + ($blue * 114) + ($green * 587)) - 128000) * -1000)
    );

nhall

<nav aria-labelledby="nav_title">
  <h2 class="visually_hide" id="nav_title">Site Navigation</h2>
  <ul aria-labelledby="nav_title">
    <li><a href="#">Academics</a></li>
    <li><a href="#">Admission</a></li>
    <li><a href="#">Student Life</a></li>
    <li><a href="#">News</a></li>
    <li><a href="#">About</a></li>
  </ul>
</nav>

nhall

// ----
// Sass (v3.3.14)
// Compass (v1.0.0)
// ----

// _config.scss
$homepage-id: 7170;


// _home.scss

nhall

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

// Using `@at-root`

.parent {
  background-color: #0e0e0e;

nhall

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

// Using `&` operator and parent selectors

/*! All Sass versions */
.parent {
  background-color: #0e0e0e;

nhall

/* _config.scss v1.0.0 */

// Vendor Dependencies
// ==========================================================================
@import "compass";


// Site attributes
// ==========================================================================
$attr_border_box: true !default;

nhall

// Modernizr mixin to create .modernizr selector -
// codepen.io/sturobson/pen/xcdha
@mixin fallback($property, $support: true) {
    @if $support == true {
        .#{$property} & {
            @content;
        }
    }
    @else {
        .no-#{$property} & {

nhall

ul.slideshow,
ul.slideshow li {
	height: 300px;
	width: 450px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	}
.slideshow { position: relative; }
	.slideshow li {

nhall

/* 
-----------------------------------------------------------------------------
 =High Resolution Images
----------------------------------------------------------------------------- */
@media screen and (-webkit-min-device-pixel-ratio: 1.3),
screen and (min--moz-device-pixel-ratio: 1.3),
screen and (-o-min-device-pixel-ratio: 2 / 1),
screen and (min-device-pixel-ratio: 1.3),
screen and (min-resolution: 192dpi),
screen and (min-resolution: 2dppx) {