/****************************************
 * Cornell University CWD
 * FOS styles
 ****************************************/
 
/* Branding changes */
#custom-branding {
    top: 20px;
    height: 120px;
    background: transparent url(/web_resources/themes/2017/img/acsf-logo-header-desktop.png)  no-repeat 0 0;
    background-size: auto 100%;
}
#custom-branding h1 {
    font-size: 3.2em;
    padding: 20px 0 0 130px;
}
#cu-seal {
    right: 120px;
    top: 20px;
    max-width: 100px;
}
#cu-seal a {
    width: 120px;
    height: 120px;
	background-size: 100%;
}
.fos-navigation .fos-menu-open a {
    float: right;
    width: 38px;
    height: 38px;
    background: #A1632C url(http://dev.acsf.cornell.edu/Assets/ACSF-Dev/images/people/faces/icon_menu32.png) 11px 12px no-repeat;
    background-size: 16px;
    cursor: pointer;
}
.fos-navigation .fos-menu-open a:hover,  .fos-navigation .fos-menu-open a:focus{
    background-color: #D26011;
}
.fos-navigation .fos-menu-open a.open {
    background: #000 url(http://dev.acsf.cornell.edu/Assets/ACSF-Dev/images/people/faces/icon_menu32.png) 11px 12px no-repeat;
	background-size: 16px;
}
.fos-navigation {
    position: absolute;
    z-index: 1;
    top: -5px;
    right: 45px;
	z-index: 1000;
}
.fos-navigation .fos-menu-open a span {
    position: absolute;
	top: -200em;
}
.fos-navigation .fos-menu {
	float: right;
	clear: both;
	width: auto;
	margin: 0;
	max-width: 45%;
    border: 0;
    background: #000;
    overflow: hidden;
    -moz-box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
}
.fos-navigation .fos-menu li {
    font-size: 1.4em;
    line-height: 0;
    margin: 0;
    padding: 0;
    display: inline-block;
    width: 16.33%;
    text-align: left;
    background-image: none;
    border: none;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
    width: 100%;
	text-transform: uppercase;
}
.fos-navigation .fos-menu li a {
    -ms-box-sizing: border-box;
	display: block; 
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 8% 0 6%;
    margin: 0;
    background: url(http://dev.acsf.cornell.edu/Assets/ACSF-Dev/images/people/faces/nav_arrow_white.svg) 98% 50% no-repeat;
	color: #fff;
}
.fos-navigation .fos-menu li a:hover, .fos-navigation .fos-menu li a:focus, .fos-navigation .fos-menu li a:active {
	color: #D26011;
}
.fos-navigation .fos-menu li a span {
    display: inline-block;
    padding: 18px 4px;
    border-bottom: 4px solid transparent;
}

.invisible {
	position: absolute;
	left: -200em;
}

/* main content area */
.fos #main {
    padding-top: 2%;
	-ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.fos #main h1 {
    font-size: 3.2em;
	text-align: center;
}
.fos #main p.intro {
    font-size: 1.4em;
	text-align: center;
	margin-bottom: 2em;
}
.fos .columns {
	margin-bottom: 3em;
}
.columns-1 .grid-item {
    width: 100%;
}
.columns-4.gapless .col-item {
    width: 24.6%;
    margin-right: 0.4%;
	-ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/*
.columns-4.gapless .col-item.odd {
    padding-bottom: 80px;
}
.columns-4.gapless .col-item.even {
   padding-top: 80px;
}
*/

.columns-4.gapless .col-item.odd .image-grid:after {
	width: 100%;
	height: 80px;
	float: left;
	content: "";
	background: -moz-linear-gradient(top,  rgba(202,216,220,1) 0%, rgba(202,216,220,0.99) 1%, rgba(202,216,220,0) 100%);
    background: -webkit-linear-gradient(top,  rgba(202,216,220,1) 0%,rgba(202,216,220,0.99) 1%,rgba(202,216,220,0) 100%);
    background: linear-gradient(to bottom,  rgba(202,216,220,1) 0%,rgba(202,216,220,0.99) 1%,rgba(202,216,220,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cad8dc', endColorstr='#00cad8dc',GradientType=0 );
}
.columns-4.gapless .col-item.even .image-grid:before {
	width: 100%;
	height: 80px;
	float: left;
	content: "";
	margin-bottom: 3px;
    background: -moz-linear-gradient(top,  rgba(176,187,190,0) 0%, rgba(202,216,220,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(176,187,190,0) 0%,rgba(202,216,220,1) 100%);
    background: linear-gradient(to bottom,  rgba(176,187,190,0) 0%,rgba(202,216,220,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b0bbbe', endColorstr='#cad8dc',GradientType=0 );
}
.fos .grid-item .view {
    height: 100%;
	background: #fff;
}
.lighter.shift .grid-item .view-first.active .image-mask, .lighter.shift .grid-item .view-first.active .mask {
background: -moz-linear-gradient(top,  rgba(30,87,153,0) 0%, rgba(101,155,181,0) 78%, rgba(121,174,189,0.8) 100%);
background: -webkit-linear-gradient(top,  rgba(30,87,153,0) 0%,rgba(101,155,181,0) 78%,rgba(121,174,189,0.8) 100%);
background: linear-gradient(to bottom,  rgba(30,87,153,0) 0%,rgba(101,155,181,0) 78%,rgba(121,174,189,0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001e5799', endColorstr='#cc79aebd',GradientType=0 );
}
.lighter.shift .grid-item .view-first.active:hover .mask {
    background-color: rgba(33,76,74, 0.7);
}
.fos .grid-item .view p {
    padding: 60% 15px 15px;
    position: absolute;
    bottom: -5px;
    padding: 0 15px;
    font-size: 22px;
	width: 100%;
}
.fos .grid-item .view p.title {
    bottom: -70px;
	font-size: 16px;
}
.fos .grid-item .view:hover p {
    bottom: 40%;
}
.fos .grid-item .view:hover p.title {
    bottom: 32%;
}
/* fos popup */
body.fos-popup {
    background: #EFF3F4 url(http://dev.acsf.cornell.edu/Assets/ACSF-Dev/images/people/faces/secondary_body_bg.png) repeat-x 0 0;
}
#content-wrap.fos.popup, #content-wrap.fos.popup #main {
    background: transparent;
	position: relative;
}
.feature-with-content.single.fos {
    padding: 0;
	width: auto;
	max-width: 268px;
	border: none;
	background: transparent;
	margin-right: 2em;
}
.feature-with-content.single.fos img {
	width: auto;
	max-width: 100%;
}
.popup.fos image-container {
	padding: 0;
}
ul.popup-nav {
	position: absolute;
	top: 1.2em;
	right: 1em;
	margin: 0;
	padding: 0;
}
ul.popup-nav li {
	display: inline-block;
	background-image: none;
	margin: 0 3px 0 0;
	padding: 0;
	width: 38px;
	height: 38px;
	line-height: 38px;
	overflow: hidden;
	background: #B3C2C5;
}
ul.popup-nav li a {
	display: block;
	width: 38px;
	height: 38px;
	overflow: hidden;
	background: #B3C2C5;
	text-decoration: none;
}
ul.popup-nav li a:hover, ul.popup-nav li a:focus, ul.popup-nav li.copy-me:hover, ul.popup-nav licopy-me:focus {
	background: #B5731F;
}
ul.popup-nav li a span {
	position: absolute;
	top: -200em;
}
ul.popup-nav .prev a:before, ul.popup-nav .next a:before {
    content: "\f053";
    font-family: FontAwesome;
    color: #fff;
	position: relative;
	top: 0;
	left: 12px;
}
ul.popup-nav .next a:before {
    content: "\f054";
	left: 14px;
}
h2.profile-name {
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}
h3.profile-title {
	color: #60605F;
	font-family: "myriad-pro-n4","myriad-pro",sans-serif;
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 1.5em;
}
ul.profile-nav {
	margin-top: 2em;
}
ul.profile-nav li {
	display: inline-block;
	background-image: none;
	margin: 0 0.5em 0 0;
	padding:0;
	padding-left: 0.5em;
	line-height: 1em;
	font-weight: bold;
	text-decoration: none;
	border-left: 1px solid #ccc;
	font-size: 16px;
}
ul.profile-nav li.first {
	padding-left: 0;
	border-left: none;
}
ul.profile-nav li a {
	text-decoration: none;
	display: inline-block;
}
p.center {
	text-align: center;
}
/* copy button */
ul.popup-nav li.copy-me {
	width: 80px;
}
button.profile-copy-button {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	line-height: 38px;
	width: 80px;
	text-align: center;
	margin: 0;
	padding: 0;
	border: none;
	color: #fff;
	background: transparent;
}

button.profile-copy-button:focus {
}

/* read more intro clip */
.more-intro {
	display: none;
}
.more-intro a {
	text-decoration: none;
}
.more-intro a:hover, .more-intro a:focus {
	text-decoration: underline;
}
/*
.more-intro a:before {
	content: "Read More";
} */
.more-intro a:before {
	content: "... Read More";
}
.more-intro a.open:before {
	content: "Read Less"
}
/* 
.less-intro-text:after {
	content: "..."
} */
.less-intro-text:after {
	content: ""
}

.less-intro-text.open:after {
	content: ""
}

/* mini footer */
#subfooter .footer-content {
    border-top: none;
	padding-top: 2%;
}

/* fixing mideum size on desktop */
.fos #content {
    max-width: 1090px;
    width: auto;
}

/* ********************************************************** */
@media only screen and (max-width: 960px) { 
}
/* ********************************************************** */


/* ********************************************************** */
@media only screen and (max-width: 800px) { 
#cu-identity.fos {
    height: 120px !important;
}
.fos-navigation {
    right: 0;
}
.fos-navigation .fos-menu {
	max-width: 100%;
}
#cu-seal {
    top: 0 !important;
	min-width: 200px;
}
.fos #cu-seal a {
    width: 150px;
    height: 36px;
}
.fos #custom-branding {
    top: 40px;
    height: 60px;
}
.fos #custom-branding h1 {
    font-size: 2.2em;
    padding: 5px 0 0 70px;
}
.columns-4.gapless .col-item {
    width: 49.6%;
    margin-right: 0.4%;
}
.image-grid {
    margin-bottom: 0;
}
.columns-4.gapless .col-item.even .image-grid:before, .columns-4.gapless .col-item.odd .image-grid:after {
	display: none;
}
.popup.fos .profile-name {
	margin-top: 2em;
}
/* read more intro clip */
.more-intro {
	display: inline;
}
.more-intro-text {
	display: none;
}
}
/* ********************************************************** */

/* ********************************************************** */
@media only screen and (max-width: 600px) { 
}
/* ********************************************************** */

/* ********************************************************** */
@media only screen and (max-width: 520px) { 
.fos .grid-item .view p {
    font-size: 18px;
}
.fos .grid-item .view p.title {
	font-size: 14px;
}
.fos .grid-item .view:hover p {
    bottom: 40%;
}
.fos .grid-item .view:hover p.title {
    bottom: 30%;
}
.popup.fos .profile-name {
	margin-top: 1em;
	clear: both;
}
.feature-with-content.single.fos {
    max-width: 100%;
    margin-right: 0;
	margin-top: 0.5em;
}
ul.popup-nav {
    left: 2em;
	top: 98%;
	padding-bottom: 1.5em;
}
ul.profile-nav {
    margin-left: 0;
}
}
/* ********************************************************** */

/* ********************************************************** */
@media only screen and (max-width: 370px) {
.fos #custom-branding h1 {
    font-size: 2em;
    padding: 7px 0 0 70px;
}
.fos #main h1 {
    font-size: 2.6em;
}
.fos #main p.intro {
    font-size: 1.2em;
	padding: 0 1em;
}
.fos .grid-item .view p.title {
    bottom: -30px;
    font-size: 12px;
	padding-top: 1em;
}
}
/* ********************************************************** */