/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */

    html { color: #222; font-size: 1em; line-height: 1.4; }
    ::-moz-selection { background: #b3d4fc; text-shadow: none; }
    ::selection { background: #b3d4fc; text-shadow: none; }
    hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
    audio, canvas, iframe, img, svg, video { vertical-align: middle; }
    fieldset { border: 0; margin: 0; padding: 0; }
    textarea { resize: vertical; }
    .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

/* ==========================================================================
   Base and Clearfix Styles
   ========================================================================== */

    body { font-family: Arial, Helvetica, sans-serif; font-weight: normal; }
    .wrapper { width: 90%; margin: 0 5%; }
    .grid:before, .grid:after, .feature-slides:before, .feature-slides:after { content:""; display:table; }
    .grid:after, .feature-slides:after { clear:both; }
    .grid, .feature-slides { *zoom:1; }
    /*.header-container, .nav-container, .feature-container, .footer-container { background: #006747; }*/
	.header-container, .feature-container, .footer-container { background: #006747; }
	.nav-container { background-color: #EFEFF0; }
    .main { padding: 20px 0; }
    img { max-width: 100%; max-height: 100%; display: block; }
	a, a:visited { border-bottom: 1px dotted #006747; color: #006747; font-weight: 700; text-decoration: none; }
	a:hover, a:active, a:focus { border-bottom: 1px solid #006747; }
    .videoWrapper {	position: relative;	padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; }
	.videoWrapper, .imageWrapper { margin-top: 25px; }
	.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

	#ou-access { text-decoration: none; }

/*  ==========================================================================
    Type
    ==========================================================================  */
    h1, h2, h3, h4, h5, h6 { font-family: 'Roboto Slab', Arial, serif; text-transform: uppercase; }
    h1, h2 { font-size: 1.429em; /* 20px */ line-height: 1.25em; color: #006747; }
    h3, h4, h5, h6 { color: #006747; }
    h3 { font-size: 1.285em; /* 18px */    line-height: 1.3333em;      margin-top: 1.3333em; }
    h4 { font-size: 1.143em; /* 16px */    line-height: 1.5em;         margin-top: 1.5em; }
    h5, h6 { font-size: 1em; /* 14px */        margin-top: 1.714em; }

/*  ==========================================================================
    Clearfix, Collapsing and Accessibility
    ==========================================================================  */
    a.skip-link, a.skip-link:hover, a.skip-link:visited, .hidden, .collapsible-heading-status { width:1px; height:1px; position:absolute; left:-99999px; top: auto; overflow:hidden; }
    
    .collapsible-content-collapsed { display:none; }
    .toggle { margin-bottom: 0; }
    
    .collapsible-heading-toggle { padding: 1em 0; display: block; text-transform: uppercase; }

    a.skip-link:active, a.skip-link:focus { 
        width: auto;
		height: auto;
        position:static; 
        background: #006747;
        color: #fff;
    }

/*  ==========================================================================
    Lists
    ==========================================================================  */ 
    ol, ul { margin-left: 1.714em; }

    [class*="list"], [class*="list"] li { margin-left: 0; list-style: none; }
    [class*="list"] li { margin-top: 0; }

    .list-block a { padding: 1em 0; display: block; text-transform: uppercase; }

/* ==========================================================================
    HEADER
   ==========================================================================  */ 

    .header-container { border-bottom: 6px solid #fff; text-align: center; position: relative; }
    .header-container img { margin: 0 auto; }
    
    .header-tagline, .header-logo, .header-social { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    
	.header-logo { margin: 30px 0; }
	.header-logo h1 { margin: 0; }
    
    .header-count-social { font-family: 'Roboto Slab', Arial, serif; text-transform: uppercase; box-sizing: border-box; text-align: center; background-color: #fff; color: #006747; font-size: 1.143em; /* 18px */ }
    
    .header-countdown { margin: 20px 0; }
	.no-js .header-countdown { display: none; }
    .header-social img { display: inline-block; padding: 5px; border: 3px solid #fff; border-radius: 10px; }
    .header-social p { margin: 0 auto; }
	.header-social a { border-bottom: none; display: inline-block;}

	.header-social a + a { margin-left: 2px; }

	.header-social a:hover img,
	.header-social a:focus img,
	.header-social a:active img {
		border-color: #9ccb3b;
	}

/* ==========================================================================
   COUNTDOWN TIMER
   ========================================================================== */
	#countdown p { display: inline; }
	#countdown span { padding: 10px 15px; background: #006747; color: #fff; font-size: 2.142em; /* 30px */ }
	#countdown .days-tens { margin-right: 5px; }
	.countdown-caption { margin: 0 0 10px 0; }

/* ==========================================================================
    NAVIGATION
   ========================================================================== */
	.nav-container { 
		border-bottom: 6px solid #fff; 
		color: #006747; 
		font-family: 'Roboto Slab', Arial, serif; 
		text-transform: uppercase; 
	}
	.nav-container a,
	.nav-container a:visited {
		color: #006747; 
		border-bottom: none;
	}
	.nav-container a:hover,
	.nav-container a:focus,
	.nav-container a:visited {
		text-decoration: underline;
	}
	.nav-toggle a, 
	.sub-nav-toggle a, 
	.nav-item > a { 
		font-size: 1.214em; 
		line-height: 1.058em;
	}
	.nav-container, 
	.nav-container * { 
		margin-top: 0; 
	}
	.no-js .nav-toggle { 
		display: none; 
	}
	.nav-toggle a { 
		padding-left: 35px; 
		background: url("/_resources/images/student-affairs/menu-default-green.png") left center no-repeat; 
	}
	.nav-toggle[aria-expanded=true] a { 
		background: url("/_resources/images/student-affairs/menu-close-green.png") left center no-repeat; 
	}
	.sub-nav-image-wrapper {
		display: inline-block;
		height: 1.4em;
	}
	.sub-nav-image {
		display: inline-block;
		padding: 0 0 8px 5px;
		vertical-align: bottom;
	}


/* ==========================================================================
    FEATURE AREA
   ========================================================================== */
    .feature-container { background-color: #006747; }
	.feature-container img { margin: 0 auto; }

	.feature-rotator, .feature-rotator .slide {
		position: relative;
	}
	.feature-rotator .slides {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
	.feature-rotator .slides > li {
		display: none; 
		-webkit-backface-visibility: hidden; /* Hide the slides before the JS is loaded. Avoids image jumping */
	} 
	.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
	html[xmlns] .slides {display: block;}
	* html .slides {height: 1%;}
	.feature-rotator img {
		max-width: 100%;
		display: block; 
	}
	.flex-direction-nav {
		width: 100%;
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		display: block;
		list-style: none;
		z-index: 2;
	}
	.flex-direction-nav a {
		position: absolute;
		width: 60px;
	} 
.flex-direction-nav a:focus {
	border: 1px dotted #9ccb3b;
}
	.flex-prev {
		left: 0;
	}
	.flex-next {
		right: 0;
	}
	/* No JavaScript Fallback */
	.no-js .feature-rotator .slides li { 
		display: block;
	}
	.no-js .feature-rotator .slides li {
		margin-bottom: 1.5em;
	}

/* ==========================================================================
    HOMEPAGE CONTENT ELEMENTS
   ========================================================================== */
    .home-content-wrapper { text-align: center; }
    
    .home-box-small, 
	.home-box-large { font-family: 'Roboto Slab', Arial, serif; text-transform: uppercase; box-sizing: border-box; padding: 20px 0; }
    
    .home-box-small { max-width: 150px; margin: 0 auto; }

    .home-box-small a,
	.home-box-large a  { font-size: .75em; display: block; color: #fff; background-color: #006747; border-bottom: 6px solid #9ccb3b; }

    .home-box-small a:hover, 
	.home-content-button a:hover, 
	.home-box-large a:hover,
	.home-box-small a:active, 
	.home-content-button a:active, 
	.home-box-large a:active,
	.home-box-small a:focus, 
	.home-content-button a:focus, 
	.home-box-large a:focus { background-color: #EFEFF0; color: #006747; text-decoration: underline; }
    
    .home-box-large { max-width: 780px; margin: 0 auto; }
    
    .home-content-button a  { font-family: 'Roboto Slab', Arial, serif; text-transform: uppercase; color: #fff; background-color: #006747; border-bottom: 6px solid #9ccb3b; padding: .75em 1em; line-height: 1.7em; }
    
	/* Grid for the homepage graphic buttons. Adapted from the Bootstrap grid. */
    .container:before,
	.container:after,
	.row:before,
	.row:after {
	  display: table;
	  content: " ";
	}
	
	.row:after {
		clear: both;
	}
	
	.row {
	  margin-right: -15px;
	  margin-left: -15px;
	}
	
	.col-sm-2across {
		float: left;
		width: 50%;
    }
    
    .col-1across {
	    width: 100%;
    }

/* ==========================================================================
    FOOTER
   ========================================================================== */

    .footer-container footer { font-size: .875em; text-transform: none; color: white; padding: 33px 0; }
    footer a, footer a:visited { color:#fff; text-decoration: none; }
    footer a:hover { text-decoration: underline; }
    footer ul { margin: 0 10px 10px 10px; padding: 0; line-height: 1.5em; }

/* ==========================================================================
    TABLES
   ========================================================================== */

    table {
        width: 100%;
    }
    .schedule-wrapper {
        table-layout: fixed;
        background-color: #CCE1DA;
        border-collapse: collapse;
    }
    .schedule-column {
      display: block;
      width: 100%; 
      float: left;
    } 
    .lt-ie8 .schedule-column {
      display: table-cell;
      width: auto; 
      float: none;
    } 
    .schedule-column th {
        font-family: 'Roboto Slab', Arial, serif; text-transform: uppercase;
        background: #006747;
    }
    .schedule-column th, .schedule-column td {    
        border-bottom: 1px solid #eee;
        padding: 0.75em;
    }
    .schedule-column tr:hover {
        background: #9ccb3b;
    }
    .schedule-column th .day-of-the-week {
      color: #9ccb3b;
      font-size: 1.143em;
    }   
    .schedule-column th .month-day {
      color: #fff;
      font-size: 1em;
    }
    .schedule-column td {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: none;
        font-size:  0.8571em;
        color: #000;
    } 
	.schedule-column a {
		display: block;
		color: #000;
	}
    .schedule-column p {
        margin: 0;
    }
	.schedule-column a {
		border-bottom: none;
		font-weight: 400;
	}
    
/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 320px) {
    
    [class*="grid-"] { width: 100%; padding: 0; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

}
        
@media only screen and (min-width: 480px) {

}

@media only screen and (min-width: 600px) {

    .home-box-small { max-width: 230px; }
    .home-box-small a, .home-box-large a  { font-size: 1em; }

    .feature-wrapper, .feature-rotator .slides li {
        min-height: 500px;
    }
    .feature-wrapper img, .feature-rotator img {
        opacity: 0;
    }
    .flex-direction-nav img {
		opacity: 1;
	}
}

@media only screen and (min-width: 768px) {
    
    h1, h2 { font-size: 1.429em; /* 20px */ line-height: 1em;}

/* ==========================================================================
    Grid
    ==========================================================================  */
    
    [class*='grid-'] { margin-top: 0; }

    .grid-1-2, .grid-2-4, .grid-1-4 { width: 50%; }
    .grid-1-3 { width: 33.33%; }
    .grid-2-3 { width: 66.66%; }
    .grid-1-4 { width: 25%; }
    .grid-3-4 { width: 75%; }
    .grid-2-5 { width: 40%; }
    .grid-3-5 { width: 60%; }
    .grid-1-6 { width: 16.66% }

    .lt-ie8 .grid-1-2, .lt-ie8 .grid-2-4 { width: 35%; }
    .lt-ie8 .grid-1-3 { width: 23.33%; }
    .lt-ie8 .grid-2-3 { width: 56.66%; }
    .lt-ie8 .grid-1-4 { width: 15%; }
    .lt-ie8 .grid-3-4 { width: 65%; }
    .lt-ie8 .grid-2-5 { width: 30%; }
    .lt-ie8 .grid-3-5 { width: 50%; }
    .lt-ie8 .grid-1-6 { width: 16.66% }

    .lt-ie8 .nav-menu {
        width: 100%;
        display: block;
        text-align: center;
    }
    .lt-ie8 .nav-item {
        width: 16%;
        display: block;
        float: left;
    }
    .lt-ie8 .nav-four .nav-item { width: 24%; }
    .lt-ie8 .nav-five .nav-item { width: 19%; }
   
/* ==========================================================================
    Header
    ==========================================================================  */

	.header-wrapper { background: #006747 url(/_resources/images/student-affairs/stripe-white.png) no-repeat right top; background-position: 137% 0; }
    
    .header-tagline img { padding: 100px 0 0; }
	.grid-1-3.header-logo, .header-tagline { position: relative; }
	.grid-1-3.header-logo { left: 33.33%; }
	.header-tagline { right: 33.33%; }
    
    .header-logo { margin: 0 auto; padding: 30px 0; }
	.header-container .grid-2-3.header-logo img { margin: 0 0 0 20px; }
    .header-logo img { max-width: 100%;}
    
    .header-count-social { background: none; text-align: right; padding: 20px 30px 0 0; }
	.header-count-social-nssc { padding-right: 5px; }
    .header-countdown .countdown-caption { width: 140px; float: right; }
    
    .header-countdown p {  }
    .header-social { clear: both; }
	.no-js .header-social, .header-social:first-child { padding-top: 100px; }
    .header-social img {  }
    
    #countdown p { display: block; }

/* ==========================================================================
    Homepage Content
    ==========================================================================  */
    .home-content-wrapper {
        max-width: 800px;
        margin: 0 auto;
    }
    
	/* Adjust the homepage graphic buttons be 3 across. */
	.col-md-3across {
	    float: left;
		width: 33.33333333%;
    }
    
/* ==========================================================================
    Table
    ==========================================================================  */
    .schedule-column {
      border-collapse: collapse;
      vertical-align: top;
      border: 1px solid #eee;
      display: table-cell;
      width: auto; 
      float: none;
    } 

    .schedule-column th {
      font-size: 0.8571em;
    }
    
    .schedule-column td {
        font-size: 0.8571em;
    }
    
	/* Add some room between columns for videos and images. */
    .videoWrapper, .imageWrapper {
		margin-left: 30px;
	}
        
}

@media only screen and (min-width: 850px) {
    
    .header-wrapper { background-position: 127% 0;}


    
}

@media only screen and (min-width: 1000px) {
    
    /*.header-wrapper, .header-tagline, .header-logo, .header-count-social { height: 300px; }*/
    .header-wrapper { background-position: 117% 0;}
    .header-count-social { padding: 20px 50px 0 0; }
	.header-count-social-nssc { padding-right: 20px; }
    
    .schedule-column th {
      font-size: 1em;
    }
    
    .schedule-column td {
        font-size: 0.8571em;
    }

}

@media only screen and (min-width: 1140px) {

/* ==========================================================================
    Maximal Width
   ========================================================================== */

    .wrapper {
        width: 1026px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }
    
    /* This special wrapper is for the apple diagonal stripe. */
    .header-wrapper {
        max-width: 1300px; /* Allows for the background stripe. */
        margin: 0 auto;
        background-position: 100% 0;
    }
    
    /*.header-wrapper, .header-tagline, .header-logo, .header-count-social { height: 340px; }*/
    .header-count-social { padding: 20px 150px 0 0; }
	.header-count-social-nssc { padding-right: 120px; }
    
    /* This special wrapper is for the oversized feature graphics. */
    .feature-wrapper {
        max-width: 1200px; /* Allows for the background stripe. */
        margin: 0 auto;
        background-position: right top;
    }

    .header-social .social-content { right: 160px; }
	
/*  ==========================================================================
    Collapsing
    ==========================================================================  */
    .nav-toggle + .collapsible-content-collapsed { display: block; }
    .nav-toggle { display: none; }

/* ==========================================================================
    Navigation
    ==========================================================================  */
    /* mega menu list */
    .nav-menu { 
		width: 100%; 
		display: table; 
		table-layout: fixed; 
		margin: 0; 
		padding: 0; 
	}
	.nav-item { 
		display: table-cell; 
	}
	.js .nav-item { 
		vertical-align: middle;
		position: relative;
	}
	.nav-toggle a,
	.nav-toggle a:visited,
	.sub-nav-toggle a,
	.sub-nav-toggle a:visited,
	.no-js .sub-nav-toggle,
	.nav-item > a,
	.nav-item > a:visited { 
		font-size: 1em; 
		line-height: 1.4;  
		padding: 1em; 
		margin: 0 0 -1px 0; 
		color: #006747; 
		border: 1px solid #EFEFF0;
	}
	
	.nav-item > a:hover, 
	.nav-item > a:focus,
	.sub-nav-toggle .collapsible-heading-toggle:hover,
	.sub-nav-toggle .collapsible-heading-toggle:focus,
	.sub-nav-toggle[aria-expanded="true"] .collapsible-heading-toggle { 
		color: #fff; 
		background-color: #006747; 
		z-index: 1;
	}
	
	.sub-nav-toggle .collapsible-heading-toggle:hover .sub-nav-image,
	.sub-nav-toggle .collapsible-heading-toggle:focus .sub-nav-image,
	.sub-nav-toggle[aria-expanded="true"] .collapsible-heading-toggle .sub-nav-image { 
		opacity: 0;
	}
	
	.sub-nav-toggle .collapsible-heading-toggle:hover .sub-nav-image-wrapper,
	.sub-nav-toggle .collapsible-heading-toggle:focus .sub-nav-image-wrapper,
	.sub-nav-toggle[aria-expanded="true"] .collapsible-heading-toggle .sub-nav-image-wrapper { 
		background: url("/_resources/images/student-affairs/main-navigation-arrow-white.png") bottom 8px left 5px no-repeat;
	}
	
	.js .sub-nav {         
        margin-top: 0px; 
        background-color: #006747; 
        color: #006747; 
        width: 100%;
		z-index: 15;
		position: absolute;
		border: 1px solid #EFEFF0;
		border-top: none;
		box-sizing: border-box;
    }
	
	.sub-nav ul { 
        display: inline-block; 
        vertical-align: top; 
        margin: 0; 
        padding: 0;
        width: 100%; 
    }
	
	.sub-nav li, .sub-nav li a { 
        font-family: Arial, Helvetica, sans-serif; 
		font-weight: 400;
        display: block; 
        list-style-type: none; 
        margin: 0; 
        text-transform: none; 
        text-decoration: none; 
        text-align: left; 
    }
	
	.js .sub-nav li a { 
        padding: 0.7em 1.5em 0.7em 1.5em; 
        color: #fff; 
    }
	
	.sub-nav li a:hover, .sub-nav li a:focus { background-color: #006747; color: #fff; }
    .no-js .sub-nav li a:hover, .no-js .sub-nav li a:focus { background-color: #9CCb3b; color: #006747; }
    
/*
    .col-md-3across, .col-sm-2across {
	  position: relative;
	  min-height: 1px;
	  padding-right: 15px;
	  padding-left: 15px;
	}
*/

}

/* End of Media Queries ===================================================== */

/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/*  ==========================================================================
    Snippet - Toggle
    ==========================================================================  */
	.snippetToggle_toggle { font-weight: bold; }
	.snippetToggle_content { margin-top: 0.75em; }

	.snippetToggle_icon { 
		margin-top: 0;
		position: absolute;
		left: 0;
		top: 50%;
		-ms-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 13px; 
		height: 15px; 
	}
	
	.snippetToggle .collapsible-heading a {
		position: relative;
		display: block;
	}

	.js .snippetToggle .collapsible-heading a,
	.js .snippetToggle .collapsible-content {
		padding-left: 2em;
	}

	.snippetToggle_toggle .snippetToggle_icon svg:first-of-type,
	.snippetToggle_toggle[aria-expanded=true] .snippetToggle_icon svg + svg { display: block; }

	.snippetToggle_toggle .snippetToggle_icon svg + svg,
	.snippetToggle_toggle[aria-expanded=true] .snippetToggle_icon svg:first-of-type { display: none; }

	.no-js .snippetToggle_icon { display: none; }

	.no-inlinesvg .snippetToggle_toggle .snippetToggle_icon { background: url(/_resources/images/v3/global/png/plus.png) no-repeat; }
	.no-inlinesvg .snippetToggle_toggle[aria-expanded=true] .snippetToggle_icon { background: url(/_resources/images/v3/global/png/minus.png) no-repeat; }

/*  ==========================================================================
    Schedule Testing
    ==========================================================================  */
.schedule-day {
	background-color: #CCE1DA;
}
.schedule-heading {
	background-color: #006747;
	color: #fff;
	font-size: 1em;
	margin: 0;
	padding: 0.75em 0.25em;
	text-align: center;
}
.schedule-heading span:first-child {
	font-size: 1.143em;
}
.schedule-event,
.schedule-event:visited {
	border-bottom: 1px solid #fff;
	color: #000;
	display: block;
	font-size: 0.8571em;
	font-weight: 400;
	padding: 1em;
}
.schedule-event:hover,
.schedule-event:active,
.schedule-event:focus {
	background-color: #EFEFF0;
	border-bottom: 1px solid #fff;
	text-decoration: underline;
}

@media only screen and (min-width: 768px) {
	.schedule {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
		column-gap: 1px;
	}
}
	

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}