/* MOBILE CSS */

/********************************************************** BODY*/

div.allWrapper
{
					width: 98%;
}

/********************************************************** TOP*/

div.logoWrapper {
	margin:1.5em 0.5em 2.5em;
}

div.logoWrapper img {
	width: 233px;
}

.svg div.logoWrapper {
	background-size: 233px;
}

#main
{
					width: 98%;
					padding:2% 0;
}

/********************************************************** Photowrapper*/

div.pwpphotoBg
{
					background-size: 100%;
					left: -1.3em;
}

div.pwpPhoto img
{

					margin:20% 8%;
}

div.pwpPhotowrapper
{
					width: 40%;
					margin-left: 1em;
}

/********************************************************** NAV*/
header.navbar
{
					width: 98%;
					height: 4em;
}

nav ul li
{
					font-size: 1.25em;
}

/********************************************************** Academic info ****/

section.ac_info
{
					width: 54%;

					margin-left: 40%;
					margin-bottom: 1em;
					padding-left:0.8em;
}

section.ac_info em
{
					/*margin-top:0.25em;*/
					font-size: 1em;
}

section.ac_info .slashes
{
	background-size: 100% 100%;
	height: 1.1em;
}

section.ac_info .slashes
{
	background-size: 100% 100%;
	height: 1.1em;
}


/**********************************************************  Academic Details ****/

section.ac_details
{
					width: 97%;
					margin-left: 5%;
					margin-top:1em;

					float: left;
					clear:both;
}

div.shadow_top
{
					display: none;
}

div.asideContentWrapper
{
					padding-left: 0em;
					padding-bottom: 0;
					background: none;
					width: 100%;
}



/**********************************************************  Main Content ****/

div.contentAndSidebar
{
					width: 97%;
					margin-left:5%;
					margin-top:0;
					float:left;
}

#contentWrap/* FORMERLY applied to section.content*/
{
					width: 100%;
					margin:0;

}

section.content
{
					width: 97%;
}

#main section.content ul.barLinks
{
	display: inline-block;
}

#main section.content ul.barLinks li
{
	/*padding: 0 1.2em 0 0;*/
}

/**********************************************************  Aside ****/

aside
{
					width: 100%;
					float: left;
}

aside div.mediaHolder
{
					/*width: calc(94% - 1.5em);
					width: -webkit-calc(94% - 1.5em);	this does not work on Mobile. hence revert to standard width	*/
					width: 89%;
}

#main #twitter-wrapper iframe {
	width: calc(86% - 1em) !important;
}

/********************* Twitter FEED (sidebar) **********************/

#main #flickr-feed {
	width:calc(86% - 1em) !important;
	height: auto;
}

/********************* RSS FEED (sidebar) **********************/

#rss-feed {
	padding-top:3em;
	padding-left:5%;
}

#rss-feed .rss-item {
	margin-bottom:2em;
}

#rss-feed h4 {
	font-size:1.8em;
}

#main #rss-feed p {
	padding-left:0;
	font-size:1.4em;	
}

#main #rss-feed p.date {
	font-size:1.15em;
}


/**********************************************************  Layout tweaks ****/


div.clearAside1
{
					padding-left:0;
					height:0;
}

.elementWrapper
{
					float: left;
					width: 100%;
					/* solid backgroud for overlapping */
					/*background-color: #F5F5F5;*/
}

div.mobileExtraSpace
{
					float:left;
					height: 1em;
					width: 94%;
					clear: both;
}


div.visibleOnMobile
{
					display: block;
}

div.contentAndSidebar div.elementWrapper
{
					width: 100%;
					margin-right: 0;
}

section.content
{
					margin-left:0.6em;
					clear:both;
}

.visibleOnMobile
{
					display: block;
}


/*
======================== 	   					 =============================
======================== 	   typography		 =============================
======================== 	   					 =============================
*/

/********************************************************** FORMS */

#pubSearchField
{
					width: 66%;
}

#pubSubmit
{
					width: 15%;
					border-right:0;
}

#searchOptions
{
					width: 100%;
					margin-left:0%;
					float:left;
}

.pubForm label
{
					width: 15%;
					margin-right:2%;
					margin-left:0;
}

.pubForm select
{
					width:75%;

					float: right;
					clear:right;
}




/**********************************************************  IMAGES */

.imageLarge
{
				    width: 100%;
}

.size-253
{
				    clear: both;
				    float: none;
				    width: 100%;
}


/**********************************************************  HEADLINES */

section.ac_info h1
{
					font-size:2.0em;
}
section.ac_details h3,
div.contentAndSidebar div.h3wrapper h3,
aside h3
{
					width: calc(93% - 2.5em);
					width: -webkit-calc(93% - 2.5em);
   				 	height: 2.55em;

   				 	line-height: 2.1em;
}

section.ac_details h3,
div.contentAndSidebar div.h3wrapper h3,
aside h3
{
					width: calc(93% - 2.5em);
					width: -webkit-calc(93% - 2.5em);
					height: 3em;

					/*font-size: 1.6em;*/
					/*width: 100%;*/
					padding-left: 1.25em;
					/*background:url('/assets/pwp/img/h3_nocorner.png') scroll 0 0 transparent no-repeat;
					background-size: 100% 100%;*/

}

@media screen and (max-width: 699px){
	section.ac_details h3:after,
	div.contentAndSidebar div.h3wrapper h3:after,
	aside h3:after {
		content: '';
		display: inline-block;
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: #0F8291;
		top: 0;
		left: 0;
		height: 46px;
		clip-path: none;
		z-index: -1;
	}
}

section.ac_details h3.long,
div.contentAndSidebar div.h3wrapper h3.long,
aside h3.long
{
					background:url('/assets/pwp/img/h3_nocorner.png') scroll 0 0 transparent no-repeat;
					background-size: 100% 100%;

}

section.content h2:first-child, section.content h2.first-child
{
					margin-top:0;
}

section.content h2
{
					font-size: 2.25em;
					width: 95%;

					background-position: 0% 0.5em;
}


#latestPubsContainer h3
{
					font-size: 1.75em;
}

/********************************************************** H3 Funkyness */

div.asideContentWrapper div.h3wrapper,
div.contentAndSidebar div.h3wrapper
{
					height:2.5em;
					padding-left:0;
}

div.asideContentWrapper span.slashes,
div.contentAndSidebar span.slashes
{
					height:2.70em;
					line-height: 2.6em;
}

div.asideContentWrapper div.h3end,
div.contentAndSidebar div.h3end
{
					/*width: 2.5em;
					height: 2.8em;*/
					height: 4.65em;
					width: 2.5em;
					margin-left:-1em;

					background: url('/assets/pwp/img/downArrow.png') scroll 50% 50% no-repeat transparent;
					background-size: 50%;
					background-color: #636363;

					border-left: 1px solid #dfdfdf;

					float:left;
					display: inline;
}

div.asideContentWrapper div.upArrow,
div.contentAndSidebar div.upArrow
{
					background: url('/assets/pwp/img/upArrow.png') scroll 50% 50% no-repeat transparent;
					background-size: 50%;
					background-color: #636363;
}

/**********************************************************  P Paragraphs */

#main section.content p
{
					font-size: 1.75em;
					line-height: 1.35;
					clear: both; /* don't let text hang around the headings */
}

#main div.asideContentWrapper p
{
					padding-left: 4%;
					font-size: 1.75em;
					clear: both; /* don't let text hang around the headings */
}

#main div.asideContentWrapper li p
{
					padding-left: 0;
					clear: none;
}

#main div.asideContentWrapper a
{
					font-size:1em;
}

#main section.ac_info p
{
					margin-top:0.75em;
					font-size: 1.5em;
					line-height: 1.25em;
					float:left;
}

aside ul.withImage li p
{
					width: 62%;
					margin-left:0.5em;
					float:left;
}




/********************************************************** P Funkyness */


/********************************************************** LINKS */



/********************************************************** LISTS */

aside div.asideContentWrapper ul
{
					width: 95%;
					padding-left:4%;
}

ul.linklist
{
					padding-left: 0;
					font-size: 1.75em;
}

ul.withImage
{
					padding-left: 0;
					font-size: 1em;
}


section.content ul li,
section.content ol li
{
					font-size: 1.8em;
}


#main section.content li
{

}

/********************************************************** SPANS */

section.content span.authNames
{
					font-size: 1.2em;
}

/********************************************************** OTHER */

section.content #respub-area.respub-container .results-found {
	font-size:0.7em;
	right:-2.9em !important;
}


/********************************************************** FOOTER */


#footerBG
{
					margin-top:2em;
}

footer
{
	width: 98%;
	margin: 2em auto;
}

#address
{
	margin-left: 2em;
	float:left;
}

footer a
{
	line-height: 2em; /* added to override long line-heights messing up mobile view */
}

footer p a
{
	/* fix for line breaking mid */
	/* link on mobile view */
	white-space: nowrap;
}

#footerBG.fixedFooter
{
	/* stop absolute positioned footer overlaying content */
	position: static;
}

/* ******************************************* WIZARDRY  */

#mobileMenuWrap ul li
{
				padding-top:2em;
				font-weight: bold;

}

/* fix for menubuttonwrapper display problems */
header.navbar nav {
	overflow: hidden;
}

nav #menuButtonWrapper {

width: 92% !important;
background-size: 10% auto;

padding-right: 0; /* this was causing dodgyness on the background image with resizing %'s mixed with ems */
padding-left: 0;
}

nav #menuButtonWrapper a,
nav #menuButtonWrapper a:visited,
nav #menuButtonWrapper a:active{
	width:90%;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hiddenOnMobile {
	display:none;
}

#publishContainer {
	display:none;
}

/* ******* FORCE RENDERING LAYER ON GPU */
section, div.contentAndSidebar, aside, #menuButtonWrapper
{
                                                                                -webkit-backface-visibility: hidden;
                                                                                -webkit-perspective: 1000;
}