/*   
Theme Name: Open Science Grid Theme
Author: Spruce Interactive
Author URI: http://spruce.it
*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

/**** Isotope Filtering ****/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* Added Styles */
@media only screen and (min-width:320px) {
	
	#page-wrap {
		padding-bottom:100px!important;
	}
	
	
	.figshare h2, .static h2, .gridblocknews h2 {
	    margin-bottom: 10px !important;
	    line-height: 1em;
	}
	
	.home article.twitter, .search article.twitter, .archive article.twitter {
		font-family: 'Merriweather', serif !important;
		line-height:20px !important;
	}
	
	.cluster h2 {
		margin-bottom:5px !important;
	}
	
	.home article p, .search article p, .archive article p {
	    font-size: 16px !important;
	    line-height: 20px !important;
	}
	
	.shadow {
	    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0) !important;
	    -moz-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0) !important;
	    -webkit-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0) !important;
	}
	
	body {
		font-family: 'Source Sans Pro', sans-serif !important;
		font-size: 16px !important;
	}
	
	#page-wrap p {
		font-family: 'Source Sans Pro', sans-serif !important;
	}
	
	.home article h2 a,
	.search article h2 a, 
	.archive article h2 a,  
	.home article footer.meta, 
	.search article footer.meta, 
	.archive article footer.meta,
	.home article p a, 
	.search article p a, 
	.archive article p a, 
	.home article p a:link, 
	.search article p a:link, 
	.archive article p a:link, 
	.home article p a:visited, 
	.search article p a:visited, 
	.archive article p a:visited,
	h1, h2, h3, h4, h5,
	.single div#page-wrap aside ul,
	.page div#page-wrap aside ul, 
	.error404 div#page-wrap aside ul,
	.single div#page-wrap article time, 
	.page div#page-wrap article time, 
	.error404 div#page-wrap article time,
	.single div#page-wrap ul li.pub span.title, 
	.page div#page-wrap ul li.pub span.title, 
	.error404 div#page-wrap ul li.pub span.title {
		font-family: 'Merriweather', serif !important;
		line-height: normal !important;
	}
	
	.cluster {
		padding: 14px 10px 10px 10px !important;
	}
	
	.cluster .line1 {
		font-size:16px !important;
	}
	
	.cluster .line2 {
		font-size:18px !important;
		margin-top: -4px !important; 
	}
	
	.cluster .line2 span {
		font-size:19px !important;
		
	}
	
	.cluster .line3 {
		font-size:14px !important;
		margin-top: 0px !important; 
	}
	
	.cluster .line4 {
		font-size:28px !important;
		margin-top: -8px !important; 
	}
	
	.cluster .line4 span {
		font-size:13px !important;
	}
	.cluster .line5 {
		font-size:25px !important;
		margin-top: -16px !important; 
	}
	
	.cluster .line6 {
		font-size:33px !important;
		margin-top: -10px !important; 
	}
	
	.home article footer.meta div.source a span, .search article footer.meta div.source a span, .archive article footer.meta div.source a span {
	    padding: 2px 2px 0 0;
	    font-size: 16px !important;
	    float: left;
	}
	
	.home article footer.meta div.source a, .search article footer.meta div.source a, .archive article footer.meta div.source a {
		font-size:11px !important;
		line-height: 16px;
	}
	
	div.figFoot a {
		line-height:32px !important;
	}
	
	.mobileMenu {
		width:40px;
		height:50px;
		background-image:url('images/menu.svg');
		background-repeat: no-repeat;
		background-position: center center;
		background-size:contain;
		cursor:pointer;
	}
	
	.mobileNav {
		display:none;
		width:100%;
		position:absolute;
		top:81px;
		left:0;
		background-color:white;
		list-style: none;
		margin:0;
		padding:0;
	}
	
	.mobileNav li {
		margin:0;
		padding:20px 0px;
		text-align: center;
		width:100%;
		border-bottom:1px solid #efefef;
	}
	
	.mobileShow {
		display:block !important;
	}
	
	.mobileHide {
		display:none !important;
	}
	
	ul.mobileSocial {
		list-style: none;
		padding:0;
		margin:0;
	}
	
	.mobileSocial a {
		display:inline-block !important; 
		width:auto;
		margin:0 5px;
		font-size:20px;
		text-align: center;
		border-bottom:0;
	}
	
	.home article footer.meta, .search article footer.meta, .archive article footer.meta {
		overflow:hidden;
	}
	
	.altM {
		display: block;
	    height: 64px;
	    width: 64px;
	    margin: 0 auto;
	}
	
	.author {
		margin-bottom:10px;
	}
	
	header #logo {
		font-size:26px !important;
		min-width:auto !important;
		line-height: 40px !important;
		padding: 20px 0 0 20px!important;
		font-family: 'Merriweather', serif !important;
	}
	
	#grid {
		top:80px !important;
	}
	
	header {
		padding-bottom: 0px !important;
		border-bottom:1px solid #efefef;
	}
	
	.headerNav {
		float: right;
	    padding: 15px 20px 15px 0px;
	}
	
	ul.topNav {
		list-style: none;
		display:block;
		float:right;
	}
	
	li.navLink {
		font-size:14px;
		float:left;
	}
	
	li.navLink i {
		text-align: center;
		display:block;
		margin-bottom:5px;
		color:#cd2305 !important;
	}
	
	li.navLink a {
		text-align: center;
		display:block;
		letter-spacing: 2px !important;
		font-family: 'Merriweather', serif !important;
		font-weight:600 !important;
		color:black !important;
	}
	
	li.navLink:hover a, li.navLink:hover i {
		color:#666666!important;
	}
	
	.stickyFooter {
		width:100%;
		height:50px;
		position:fixed;
		bottom:0;
		left:0;
		right:0;
		border-top:1px solid #efefef;
		background-color:white;
		padding:15px 50px;
		box-sizing:border-box;
	}
	
	ul.footerLeft li {
		float:left;
	}
	
	ul.footerLeft li span {
		display:inline-block;
		padding:0px 10px;
	}
	
	.footerSearch {
		position:relative;
		width:150px;
		float:right;
	}
	
	.stickyFooter form#searchform div input[type="search"] {
	    -webkit-appearance: none;
	    border: 1px solid #bbbbbb;
	    position: relative;
	    top: -4px;
	    z-index: 1;
	    color: #666666;
	    font-size: 12px;
	    width: 150px;
	    height: 25px;
	    margin-left:10px;
	}
	
	.stickyFooter form#searchform div button {
	    background: none repeat scroll 0 center transparent;
	    border: 0 none;
	    color: #bbbbbb !important;
	    position: absolute;
	    right: 0px;
	    top: 0px;
	    z-index: 200;
	}
	
	.footerSocial {
		float:right;
	}
	
	.footerSocial ul li {
		float:left;
		margin:0px 5px;
	}
	
	.footerSocial ul li a {
		line-height:normal;
	}
}

@media only screen and (min-width:862px) {
	
	.mobileHide {
		display:block !important;
	}
	
	.mobileShow {
		display:none !important;
	}
	
	.home article footer.meta, .search article footer.meta, .archive article footer.meta {
		overflow:hidden;
	}
	
	.altM {
		display: block;
	    height: 64px;
	    width: 64px;
	    margin: 0 auto;
	}
	
	.author {
		margin-bottom:10px;
	}
	
	header #logo {
		font-size:28px !important;
		min-width:auto !important;
		padding: 20px 0 0 60px !important;
	}
	
	#grid {
		top:80px !important;
	}
	
	header {
		padding-bottom: 0px !important;
		border-bottom:0px solid #efefef;
	}
	
	.single div#page-wrap {
		padding-top:80px;
	}
	
	.headerNav {
		float: right;
	    padding: 34px 20px 10px 0px;
	}
	
	ul.topNav {
		list-style: none;
		display:block;
		float:right;
	}
	
	li.navLink {
		font-size:14px;
		float:left;
	}
	
	li.navLink i {
		text-align: center;
		display:none;
		margin-bottom:5px;
		color:#cd2305 !important;
	}
	
	li.navLink a {
		text-align: center;
		display:block;
		letter-spacing: 1px !important;
		font-family: 'Source Sans Pro', sans-serif !important;
		font-weight:600 !important;
		color:black !important;
	}
	
	li.navLink:hover a, li.navLink:hover i {
		color:#666666!important;
	}
	
	.stickyFooter {
		width:100%;
		height:50px;
		position:fixed;
		bottom:0;
		left:0;
		right:0;
		border-top:1px solid #efefef;
		background-color:white;
		padding:15px 50px;
		box-sizing:border-box;
	}
	
	ul.footerLeft li {
		float:left;
	}
	
	ul.footerLeft li span {
		display:inline-block;
		padding:0px 10px;
	}
	
	.footerSearch {
		position:relative;
		width:150px;
		float:right;
	}
	
	.stickyFooter form#searchform div input[type="search"] {
	    -webkit-appearance: none;
	    border: 1px solid #bbbbbb;
	    position: relative;
	    top: -4px;
	    z-index: 1;
	    color: #666666;
	    font-size: 12px;
	    width: 150px;
	    height: 25px;
	    margin-left:10px;
	}
	
	.stickyFooter form#searchform div button {
	    background: none repeat scroll 0 center transparent;
	    border: 0 none;
	    color: #bbbbbb !important;
	    position: absolute;
	    right: 0px;
	    top: 0px;
	    z-index: 200;
	}
	
	.footerSocial {
		float:right;
	}
	
	.footerSocial ul li {
		float:left;
		margin:0px 5px;
	}
	
	.footerSocial ul li a {
		line-height:normal;
	}
}

@media only screen and (min-width:1080px) {
	
	.home article footer.meta, .search article footer.meta, .archive article footer.meta {
		overflow:hidden;
	}
	
	.altM {
		display: block;
	    height: 64px;
	    width: 64px;
	    margin: 0 auto;
	}
	
	.author {
		margin-bottom:10px;
	}
	
	header #logo {
		font-size:34px !important;
		min-width:auto !important;
	}
	
	#grid {
		top:80px !important;
	}
	
	header {
		padding-bottom: 0px !important;
		border-bottom:0px solid #efefef;
	}
	
	.headerNav {
		float: right;
	    padding: 34px 60px 12px 0px;
	}
	
	ul.topNav {
		list-style: none;
		display:block;
		float:right;
	}
	
	li.navLink {
		font-size:14px;
		float:left;
	}
	
	li.navLink i {
		text-align: center;
		display:none;
		margin-bottom:5px;
		color:#cd2305 !important;
	}
	
	li.navLink a {
		text-align: center;
		display:block;
		letter-spacing: 2px !important;
		font-family: 'Source Sans Pro', sans-serif !important;
		font-weight:600 !important;
		color:black !important;
	}
	
	li.navLink:hover a, li.navLink:hover i {
		color:#666666!important;
	}
	
	.stickyFooter {
		width:100%;
		height:50px;
		position:fixed;
		bottom:0;
		left:0;
		right:0;
		border-top:1px solid #efefef;
		background-color:white;
		padding:15px 50px;
		box-sizing:border-box;
	}
	
	ul.footerLeft li {
		float:left;
	}
	
	ul.footerLeft li span {
		display:inline-block;
		padding:0px 10px;
	}
	
	.footerSearch {
		position:relative;
		width:150px;
		float:right;
	}
	
	.stickyFooter form#searchform div input[type="search"] {
	    -webkit-appearance: none;
	    border: 1px solid #bbbbbb;
	    position: relative;
	    top: -4px;
	    z-index: 1;
	    color: #666666;
	    font-size: 12px;
	    width: 150px;
	    height: 25px;
	    margin-left:10px;
	}
	
	.stickyFooter form#searchform div button {
	    background: none repeat scroll 0 center transparent;
	    border: 0 none;
	    color: #bbbbbb !important;
	    position: absolute;
	    right: 0px;
	    top: 0px;
	    z-index: 200;
	}
	
	.footerSocial {
		float:right;
	}
	
	.footerSocial ul li {
		float:left;
		margin:0px 5px;
	}
	
	.footerSocial ul li a {
		line-height:normal;
	}
}