/*  ==========================================================================
    Master secondary stylesheet for USF
    Author: Charlotte Koh, USF University Communications and Marketing
    Author URL: http://www.usf.edu/ucm/
    ==========================================================================  */

/*  ==========================================================================
    General
    ==========================================================================  */
	.content { margin-top: 0; }
	.fullContent > * + * { margin-top: 3em; }

/*  ==========================================================================
    Section Hero and Brand Hero
    ==========================================================================  */
	.sectionHero, .brandHero { margin-top: 0; }

	@media (min-width: 500px), print {
		.sectionHero, .brandHero { padding: 5em 0; }
		.brandHero { text-align: center; }
		.sectionHero_content, .brandHero_content {
			max-width: 25em;
		}
		.brandHero_content { margin: 0 auto; }
		.sectionHero_text { margin-top: 0.75em; }
	}

	@media (min-width: 850px), print {
		.sectionHero, .brandHero { padding: 7em 0; }
		.brandHero_content { max-width: 43.75em; }
		.brandHero_text {
			font-size: 1.5em;
			line-height: 1.5em;
		}
	}

	@media screen and (min-width: 1000px) {
		.sectionHero { padding: 10em 0; }
		.brandHero { padding: 15em 0 5em; }
	}

/*  ==========================================================================
    Section Heading
    ==========================================================================  */
	.sectionHeading { margin-top: 2.25em; }

	.sectionHeading_text {
		color: #3f565e;
		font: 600 3em/1em "Barlow Condensed", sans-serif;
	}

/*  ==========================================================================
    Breadcrumbs
    ==========================================================================  */
	.sectionHeading ~ .breadcrumbs { margin-top: 0.75em; }

	.breadcrumbs * + * { margin-top: 0; }
	.breadcrumb_item { float: left; }

	.breadcrumb_item + .breadcrumb_item:before {
		color: #b2b2b2;
		content: "/";
		margin: 0 0.5em;
	}
	.breadcrumb_link { font-weight: 600; }

/*  ==========================================================================
    Main Content
    ==========================================================================  */
	@media (min-width: 850px), print {	
		.mainContent_well { flex: 3;  }
		
		.no-flexbox .mainContent_well {
			float: right;
			width: 70%;
			margin-left: 0;
		}
	}
	

/*  ==========================================================================
    Section Navigation
    ==========================================================================  */
	.sectionNav_toggle {
		position: relative;
		text-transform: uppercase;
	}
	.sectionNav_toggle a { padding-left: 35px; }
	.sectionNav_toggle a, .sectionNav a { display: block; }

	.sectionNav_icon {
		margin-top: 0;
		position: absolute;
		top: 50%;
		left: -4px;
		-ms-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.no-inlinesvg .toggle .sectionNav_icon { background: url(/_resources/images/v3/global/png/menu-green.png) center center no-repeat; }
	.no-inlinesvg .toggle[aria-expanded=true] .sectionNav_icon { background: url(/_resources/images/v3/global/png/close-green.png) center center no-repeat; }

	
	.sectionNav_menu a { font-weight: 600; }

	.sectionNav ul { list-style: none; }
	.sectionNav_menu, .sectionNav_menu ul:first-child { margin-left: 0; }

	.sectionNav li + li { margin-top: 1.5em; }
	.sectionNav li li + li { margin-top: 1em; }

	.sectionNav_menu > li > a,
	.sectionNav_menu ul:first-child > li > a {
		font: 1.375em/1.09em "Barlow Condensed", sans-serif;
		text-transform: uppercase;
	}

	.sectionNav_active,
	.sectionNav_active:visited {
		color: #3f565e;
	}

	

	@media screen and (max-width: 849px) {
		.sectionNav_toggle[aria-expanded=true] + ul,
		.no-js .sectionNav ul {
			padding-bottom: 1.5em;
		}
	}
	@media (min-width: 850px), print {	
		.sectionNav_toggle { display: none; }
		.sectionNav > ul { display: block; margin-top: 0; }
		
		.no-flexbox .sectionNav {
			float: left;
			width: 25%;
		}
	}

/*  ==========================================================================
    Quick Links
    ==========================================================================  */
	* + .quickLinks {
		border-top: 1px solid #b2b2b2;
		padding-top: 1.5em;
	}
	.quickLinks {
		text-transform: uppercase;
	}
	.quickLinks_item + .quickLinks_item {
		margin-top: 1.5em;
	}
	.quickLinks_link {
		display: inline-block;
		font: 1.375em/1.09em "Barlow Condensed", sans-serif;
		padding-left: 35px;
		position: relative;
	}
	.quickLinks_heading {
		color: #3f565e;
		font: 600 1.75em/1.25em "Barlow Condensed", sans-serif;
	}
	.quickLinks .cta_icon {
		left: 0;
		right: auto;
		width: 25px;
		height: 25px;
	}
	
	


/*  ==========================================================================
    Secondary Content
    ==========================================================================  */
	.secondaryContent {
		background-color: #efeff0;
		margin-top: 4.5em;
	}
	.secondaryContent_heading {
		color: #007A60;
		font: 600 2.5em/1.2em "Barlow Condensed", sans-serif;
		text-transform: uppercase;
	}
	.secondaryContent_list li + li { margin-top: 1em; }

	@media screen and (max-width: 849px) {
		.secondaryContent { padding: 3em; }
		.secondaryContent_image img { margin: 0 auto; }
	}

	@media (min-width: 850px), print {
		.secondaryContent_well {
			flex: 2;
			padding: 3em 3em 3em 0;
		}
		.secondaryContent_list {
			columns: 2;
			column-gap: 3em;
		}
	}

/*  ==========================================================================
    Info Sections
    ==========================================================================  */
	.infoSection {
		border-top: 1px solid #b2b2b2;
		padding-top: 1.5em;
	}
	.infoSection * + *, .infoSection_item + .infoSection_item { margin-top: 1em; }

	.mainContent .infoSection_heading {
		color: #3f565e;
		font: 600 1.75em/1.25em "Barlow Condensed", sans-serif;
		text-transform: uppercase;
	}

/*  ==========================================================================
    Tables
    ==========================================================================  */
	.table { width: 100%; overflow: auto; }

	table { 
		table-layout: fixed;
		width: 100%;
	}
	caption {
		font-size: 1.25em;
		font-weight: bold;
		padding: 0.65em;
		text-align: left;
	}

	tbody, tr, th, td { margin-top: 0;}
	thead th { border-bottom: 3px solid #b2b2b2; }
	tr + tr td { border-top: 1px solid #b2b2b2; }
	th, td { padding: .813em; text-align: left; }
	th { font-weight: bold; }

	.table-striped tbody tr:nth-child(odd), 
	.table-bordered-striped tbody tr:nth-child(odd) {
		background-color: #efeff0;
	}
	.table-striped td, 
	.table-striped tbody th {
		border: 2px solid #fff;
	}
	.table-bordered, 
	.table-bordered-striped {
		border: 1px solid #b2b2b2;
	}
	.table-bordered td + td, 
	.table-bordered thead th + th, 
	.table-bordered-striped td + td, 
	.table-bordered-striped thead th + th {
		border-left: 1px solid #b2b2b2;
	}

/*  ==========================================================================
    Tables - Responsive
    ==========================================================================  */
	.responsive-table, 
	.responsive-table caption, 
	.responsive-table thead, 
	.responsive-table tbody, 
	.responsive-table tr, 
	.responsive-table th, 
	.responsive-table td {
		display: block;
	}
	.responsive-table thead, 
	.responsive-table thead th {
		width:1px;
		height:1px;
		position:absolute;
		left:-9999px;
		top:auto;
		overflow:hidden;
	}
	.responsive-table tr:before, 
	.responsive-table tr:after {
		content: '';
		display: table;
	}
	.responsive-table tr:after {
		clear: both;
	}
	.responsive-table tr {
		*zoom: 1;
	}
	.responsive-table th, 
	.responsive-table td {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;    
		box-sizing: border-box;         
	}
	.responsive-table td {
		width: 100%;
		padding-left: 50%;
		position: relative;
		float: left;
		border: none;
		border-bottom: 1px solid #DCDDDE;
		text-align: left;
	}
	.responsive-table td:before {
		width: 45%;
		padding: 10px;
		position: absolute;
		top: 0;
		left: 0;
		content: attr(data-usf-tblcolumn);
		font-weight: bold;
	}
	.responsive-table tbody tr:nth-child(odd) {
		background-color: #ECEDED;
	}
	.responsive-table tbody tr:nth-child(odd) td {
		border-bottom: 1px solid #fff;
	}
	.responsive-table.table-bordered, 
	.responsive-table.table-bordered-striped {
		border: none;
	}
	.responsive-table.table-bordered td + td, 
	.responsive-table.table-bordered thead th + th, 
	.responsive-table.table-bordered-striped td + td, 
	.responsive-table.table-bordered-striped thead th + th {
		border-left: none;
	}

/*  ==========================================================================
    Snippet - Button
    ==========================================================================  */
	a.snippetButton, 
	a.snippetButton:visited {
		background-color: #006747;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		
		color: #fff;
		display: block;
		font-weight: normal;
		max-width: 200px;
		padding: 0.5em 1em;
		text-align: center;	;
	}

	a.snippetButton:hover, 
	a.snippetButton:active, 
	a.snippetButton:focus {
		background-color: #327052;
	}

/*  ==========================================================================
    Brand Snippet - Heading
    ==========================================================================  */
	.snippetHeading {
		color: #006747;
		font-size: 1.75em;
		font-weight: 600;
		line-height: 1.25em;
	}

/*  ==========================================================================
    Brand Snippet - Callout
    ==========================================================================  */
	@media screen and (max-width: 849px) {
		.snippetCallout {
			margin-left: auto;
			margin-right: auto;
			max-width: 500px;
		}
		.snippetCallout + .snippetCallout .snippetCallout_text {
			border-top: 1px solid #b2b2b2;
			padding-top: 3em;
		}
	}
	@media screen and (min-width: 1000px) {
		.snippetCallout {
			align-items: center;
		}
	}

	
/*  ==========================================================================
    Brand Snippet - Grid
    ==========================================================================  */
	.snippetGrid {
		text-align: center;
	}
	@media screen and (max-width: 849px) {
		.snippetGrid_image { margin: 0 auto; }
	}


/*  ==========================================================================
    Snippet - Media
    ==========================================================================  */
    .snippetMedia_caption { margin: 0; font-style: italic; }
	.snippetMedia--large, [class*="snippetMedia--medium"], [class*="snippetMedia--small"] { margin-bottom: 1.5em; }
	.snippetMedia--large img, [class*="snippetMedia--medium"] img, [class*="snippetMedia--small"] img { max-width: 100%; }

	.snippetMedia--centered img { margin: 0 auto; }

    [class*="snippetMedia--small"] { width: 100px; }

    .snippetMedia--small-right { float: right; margin-left: 1.5em; }
    .snippetMedia--small-left { float: left; margin-right: 1.5em; }

	@media (min-width: 500px), print {
		[class*="snippetMedia--medium"] { width: 44%; }

		.snippetMedia--medium-right { float: right; margin-left: 1.5em; }
		.snippetMedia--medium-left { float: left; margin-right: 1.5em; }
	}


/*  ==========================================================================
    Snippet - Rotator/Full Image
    ==========================================================================  */
	.snippetRotator { position: relative; }

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

	.snippetRotator_prev, 
    .snippetRotator_next {
        background: rgba(0, 0, 0, 0.6);
		position: absolute;
		margin-top: 0;
		top: 212px;
		width: 75px;
		height: 75px;
		border-radius: 50%;
		z-index: 3;
    }

	.snippetRotator_icon {
		color: #fff;
		margin-top: 0;
		width: 50px;
		height: 57px;
		position: absolute;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}

    .snippetRotator_prev { left: 2em; }
    .snippetRotator_next { right: 2em; }

	.no-inlinesvg .snippetRotator_prev .snippetRotator_icon { 
		background: url(/_resources/images/v3/global/png/rotator-previous.png) no-repeat; 
	}
	
	.no-inlinesvg .snippetRotator_next .snippetRotator_icon { 
		background: url(/_resources/images/v3/global/png/rotator-next.png) no-repeat; 
	}

    .snippetRotator_controls {
        display: none;
    }

	.snippetRotator_slides { margin-top: 0; }
    .snippetRotator_slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
    html[xmlns] .snippetRotator_slides {display: block;}
    * html .snippetRotator_slides {height: 1%;}

    .js .snippetRotator_slide {
        display: none; 
        margin-top: 0;
        -webkit-backface-visibility: hidden; /* Hide the slides before the JS is loaded. Avoids image jumping */
    } 
	.no-js .snippetRotator_slide { margin-top: 3em; }

	.snippetRotator_image, .snippetFullImg {
		display: block;
        height: 500px;

        -webkit-transition: min-height 1s ease;
        transition: min-height 1s ease;
    }
    .snippetRotator_caption {
        font-weight: 700;
    }

	@media (min-width: 850px), print {
        .snippetRotator_slide {
            position: relative;
        }
        .snippetRotator_controls {
            position: absolute;
            display: flex;
			justify-content: center;
            width: 100%;
            margin: 0;
            text-align: center;
            list-style: none;
			z-index: 3;
        }

        .snippetRotator_controlItem + .snippetRotator_controlItem {
            margin: 0 0 0 1.5em;
        }
        .snippetRotator_controlLink, 
        .snippetRotator_controlLink:visited {
            width: 15px;
            height: 15px;
            display: block;
            background-color: #b2b2b2;
            border-radius: 15px;
            -webkit-transition: background 0.5s ease;
            transition: background 0.5s ease;
        }
        .snippetRotator_controlLink.flex-active, 
        .snippetRotator_controlLink:hover, 
        .snippetRotator_controlLink:active, 
        .snippetRotator_controlLink:focus {
            background-color: #007955;
        }
		.snippetRotator_caption {
			margin-top: 3em;
		}
    }

	@media screen and (min-width: 1200px) {
		.snippetRotator_image, .snippetFullImg {
			height: 700px;
		}
		.snippetRotator_prev, 
		.snippetRotator_next {
			top: 312px;
		}
	}


/*  ==========================================================================
    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; }


/*  ==========================================================================
    Visit USF
    ==========================================================================  */
	.visitUSF_form {
		max-width: 320px;
	}
	.visitUSF_search {
		background-color: #fff;
		border: 1px solid #b2b2b2;
		border-right: none;
		float: left;
		padding:5px;
		width:79%;
		height: 18px;
	}
	.visitUSF_button {
		width: 15%;
		height: 30px;
		float: left;
		background-color: #0e7b5b;
		border: none;
		color: #fff;
		cursor: pointer;
		font-weight: bold;
		text-transform: uppercase;
	}
	.visitUSF_search, .visitUSF_button {
		margin-top: 0;
	}

/*  ==========================================================================
    DEPRECATED - Callouts
    ==========================================================================  */
	.callout-caption {
		color: #999999;
		font-style: italic;
		width: 100%;
	}
	.callout img {
		max-width: 100%;
		width: auto;
		height: auto;
		display: block;
		margin-top: .25em;
	}
	.callout-small {
		width: 100px;
	}
	.callout-small.callout-right {
		float: right;
		margin-left: 1.5em;	
	}
	.callout-small.callout-left {
		float: left;
		margin-right: 1.5em;	
	}

	@media (min-width: 500px), print {
		.callout-medium {
			width: 44%;
		}
		.callout-right {
			float: right;
			margin-left: 1.5em;
		}
		.callout-left {
			float: left;
			margin-right: 1.5em;
		}
	}