﻿/**** PPPL Theory ****/
@import url(https://fonts.googleapis.com/css?family=Source+Serif+Pro:400,700);

html, body { min-width: 1200px; }
body { font-family: 'Source Serif Pro', serif; font-size: 14px; line-height: 1.6em; color: #333; background-color: #303030; }
p { margin-top: 0; font-size: 1em; line-height: 1.4em; }
ul { line-height: 1.4em; }

h3 { margin-top: 0.6em; margin-bottom: 0.6em; }

/* images */
img.image { width: 100%; }
.ie7_8 img.image { width: auto; }
img.leading { margin-top: 1em; } /* ONLY IN BOOKS.PHP */
img.image1 { margin-bottom: 1em; } /* ONLY IN BOOKS.PHP */

/* links */
a { color: #ED9618; text-decoration: none; border-bottom: 1px dotted #ED9618; }
    a:hover { color: #494949; border-color: #494949; }
	a.active { color: #999999; border-color: #999999; }
    a.image { border-bottom: none; }
        a.image:hover img { opacity: 0.8; filter:alpha(opacity=80); /* For IE8 and earlier */ }
        a.image:hover img.no-fade { opacity: 1; filter:alpha(opacity=100); /* For IE8 and earlier */ }
a.no-line { border-bottom: none; }
a.no-color { color: #333; }

/* buttons */
.button { position: relative; display: inline-block; background-color: #ED9618; color: #fff !important; border-radius: 6px; border: 0; font-size: 1em; line-height: 2em; box-shadow: 0.125em 0.175em 0 0 rgba(0,0,0,0.125); font-weight: 600; text-align: center; padding: 0 1em;
	-webkit-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
	.button:hover { background-color: #494949; text-decoration: none; }
	.button:active { background-color: #999999; }

/* clears bullet and indent from list */
ul.no-indent { list-style-type: none; padding: 0; }
/* list styles */
ul.list1 { margin-top: 0; }
ul.list1 li{ padding: 2px 5px 2px 5px; margin-bottom: 2px; font-size: 0.95em; }
.list-heading-small { font-size: 0.85em; text-transform: uppercase; }
/* alternate colors */
ul.alt-colors li:nth-of-type(odd) { background-color: #f0f0f0; }
ul.alt-colors li:nth-of-type(even) { background-color: #f8f8f8; }
/* list headings */
ul li.title { font-size: 1.4em; font-weight: bold; margin-bottom: 0.4em; }
ul li.sub-title { font-size: 0.9em; font-weight: bold; }
ul li.subsub-title { font-size: 0.8em; font-weight: bold; }
 
/* clearfix */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; } 
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/*** template ***/
.container { width: 1200px; margin: 0 auto; padding: 0; }

/*** template: header ***/
#header-wrapper { font-family: Arial, sans-serif; position: fixed; top: 0px; margin: auto; z-index: 100000; width: 100%; padding-top: 3px; background-color:#040404; background-image: url('/images/topbar-background.jpg'); background-size: cover; }
.ie7_8 #header-wrapper { position: relative; }
/* pppl logo */
.ie7_8 #logo-pppl { text-align: center; }
#logo-pppl img { margin: 2px 0 0 22px; height: 45px; }
.ie7_8 #logo-pppl img { margin: 0; }
/* theory dept name */
#theory-name { color: #fff; font-size: 2.2em; letter-spacing: 4px; text-align: right; margin-top: 14px; padding-right: 0.5em; }
.ie7_8 #theory-name { text-align: center; }
#theory-name a { color: #fff; border: none; }
#theory-name a:hover { color: #F58025; }
/* search box */
#cse-search-box { font-size: 0.7em; text-align: right; margin-top: 12px; }
.ie7_8 #cse-search-box { text-align: center; }
    #cse-search-box input[type="text"] { margin: 3px; padding: 3px 10px 3px 10px; color: #333; border: 1px solid #d0d0d0; background-color: #fff; }
    #cse-search-box input[type="submit"] { border: 1px solid #999; padding: 3px; color: #fff; background-color: #666; }
/* headermenu */
#menu a, #menu ul li a { font-size: 1.2em; font-weight: bold; color: #666; border: none; text-decoration: none; }
	#menu a.active, #menu ul li a.active { color: #F58025; }
	#menu a:hover, #menu ul li a:hover { color: #F58025; }
#menu { padding: 1px 0 2px 0; padding-top: 2px; width: 100%; border-top: #F58025 solid 3px; background: #fff; border-bottom: 1px #ccc solid; }
    #menu ul { margin: 0; padding: 0; list-style-type: none; text-align: center; }
        #menu ul li { display: inline; font-size: 0.9em; padding: 0.2em 29px; /*change depending on menu*/ }
		#menu ul li:first-child { padding-left: 0; }
		#menu ul li:last-child { padding-right: 0; }
#menu-home { text-align: right; }
.ie7_8 #menu-home { display: none; }
.ie7_8 #menu-contact { display: none; }

/*** template: content ***/
#content-wrapper { background-image: url('/images/background.jpg'); background-size: cover; background-attachment: fixed; padding: 20px 0 10px 0; }
#content-wrapper.fixed-header-offset { margin-top: 85px; /*offset for #header fixed position*/ }
.ie7_8 #content-wrapper { margin-top: 0; }

/*** template: footer ***/
#footer-wrapper { font-family: Arial, sans-serif;  }
#footer-top { color: #fff; font-size: 0.9em; border-top: 1px #555 solid; border-bottom: 1px #555 solid; padding-top: 5px; background-color: #666;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #777), color-stop(100, #666));
	background-image: -webkit-linear-gradient(top, #777 0%, #666 100%);
	background-image: linear-gradient(to bottom, #777 0%, #666 100%);
}
#footer-top a { color: #fff; border: 0; }
	#footer-top a:hover { color: #ccc; }
#footer-bottom { color: #ddd; font-size: 0.9em; padding: 20px 0; background-color: #333;
	background-image: -webkit-linear-gradient(#4A4A4A 0%, #303030 100%);
	background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#4A4A4A), to(#303030));
	background-image: linear-gradient(#4A4A4A 0%, #303030 100%);
}
#footer-bottom a { color: #ddd; border: 0; }
	#footer-bottom a:hover { color: #999; border-color: #494949; }
/* sitemap in footer */
.sitemap { text-align: right; }
.ie7_8 .sitemap { text-align: left; }
.sitemap ul { display: inline-block; margin: 0; padding: 0; }
	.sitemap ul li { float: left; padding: 0; list-style: none; }
	.ie7_8 { padding-right: 20px; }
	.sitemap ul li:not(:last-child) { border-right: 1px solid #999; margin-right: 10px; padding-right: 10px; }
/* main footer styles */
.footer-heading { font-size: 1.5em; margin-bottom: 1em; }
/* sponsor boxes in footer */
.sponsor { background-color: #FFF; padding: 5px 10px; margin: 5px 30px 5px 30px; border: 1px solid #ccc; }
/* social media links in footer */
.ico-facebook { color: #8EA8DE; }
.ico-facebook:hover { color: #3b5998; }
.ico-twitter { color: #B0D8F7; }
.ico-twitter:hover { color: #55acee; }
.ico-youtube { color: #F27777; }
.ico-youtube:hover { color: #bb0000; }
.ico-flickr { color: #FF8AC6; }
.ico-flickr:hover { color: #ff0084; }

/*** template: misc ***/
/* submenu at left column*/
#submenu-sticky { position:fixed; float: right; width: 200px; }
#submenu ul { font-family: Arial, sans-serif; margin: 0 0 0 20px; padding: 0; list-style: none; }
    #submenu ul .title { text-align: right; font-size: 1.5em; font-weight: bold; text-transform: uppercase; margin-bottom: 0.8em; }
	.ie7_8 #submenu ul .title { text-align: left; }
    #submenu ul li { margin-bottom: 0.3em; font-size: 1.1em; font-weight: bold; line-height: 1.4em; text-align: right; }
	.ie7_8 #submenu ul li { text-align: left; }
    #submenu ul a { color: #333; border: none; text-decoration: none; }
        #submenu ul a:hover { color: #F58025; text-decoration: none; }
		#submenu ul a.active { color: #F58025; }
.anchor-offset:before { display: block; content: " "; 
  	height: 126px; /* Give height of fixed element (height of #header-wrapper + 20px) */
	margin-top: -126px; /* Give negative margin of fixed element */  	
	visibility: hidden; 
}
.anchor-seminar:before { display: block; content: " "; 
  	height: 86px; /* Give height of fixed element (height of #header-wrapper + 20px) */
	margin-top: -86px; /* Give negative margin of fixed element */  	
	visibility: hidden; 
}
/*right column list*/
.wrapper-right-col-list{ font-family: Arial, sans-serif; overflow: auto; position: relative; max-width: 100%; max-height: 400px;
	box-sizing: border-box;
    border-right: none;
}
.rightCol-subitem { position: relative; margin-bottom: 0.3em; padding: 5px; background-color: #fff; border: 1px solid #ccc; box-shadow: 2px 2px 2px #888; }
    .rightCol-subitem a.image { width: 25%; float: left; margin-right: 5%; }
    .rightCol-subitem img { display: block; width: 100%; }
    .rightCol-subitem .desc { width: 70%; float: left; font-size: 0.8em; line-height: 1.1em; }
    .rightCol-subitem .title { margin-bottom:0.5em; }

/*** articles wrappers ***/
/* general article wrapper */
.wrapper-article { margin-bottom: 2em; padding: 14px 20px; background-color: #fff; box-shadow: 2px 3px 6px #888; }
/* overview article wrapper */
.wrapper-overview { margin-bottom: 1.4em; padding: 0.8em 1.2em; background-color: #fff; box-shadow: 2px 3px 6px #888; }
    .wrapper-overview .overview-image img { width: 100%; display: block; }
	.ie7_8 .wrapper-overview .overview-image img { width: auto; }
    .wrapper-overview .overview-desc .title { margin-bottom: 1em; font-weight: bold; }

/*** misc ***/
/* grid/table */
.wrapper-table { padding: 0.5em 2em 2em 2em; }
    .wrapper-table table { width: 100%; }
        .wrapper-table tr { width: 100%; }
        .wrapper-table td { padding: 0.5em 1em; border: 1px solid #999; color: #333; }
            /* two col grid - desc 75% & link 25% */
            .wrapper-table td.desc { width: 75%; }
            .wrapper-table td.link { width: 25%; text-align: center; vertical-align:top; }
            .wrapper-table td.link .button { width: 100%; box-sizing: border-box; }

/*** page: seminars ***/
/* Upcoming and Past Seminars list */
ul.seminar span.title { font-weight: bold; }
ul.seminar div.info { float:left; }
ul.seminar div.info2 { float:right; text-align:right; font-size: 0.9em; }
ul.seminar div.description { display: none; margin: 5px 5px 0 5px; font-size: 0.9em; }

/*** page: people ***/
/* people article */
.wrapper-people {
    margin-bottom: 2em;
    padding: 1em 35px 2em 35px;
    background-color: white;
    box-shadow: 2px 3px 6px #888;
}
    .wrapper-people .col-7-1 {
		font-family: Arial, sans-serif;
        margin-bottom: 4px;
        padding: 0 5px;
        overflow: hidden;
        font-size: 0.8em;
        line-height: 1.2em;
        min-height: 120px;
    }
        .wrapper-people .col-7-1:nth-child(7n+1) { clear: both; }
div[class*="wrapper-people"] div.hide { display: none; } /* hide second name */

/*** page: profile ***/
/* Paper and Additional */
ul.profile { font-size: 0.9em; }
img.profile-image { float: left; min-width: 30%; max-width: 60%; padding: 0 20px 20px 0; }
.ie7_8 div.peopleList { display: none; }

/*** page: research ***/
/* research image */
div.research-image-container { margin-bottom: 2em; }
div.caption { font-size: 0.9em; font-weight: bold; text-align: center; }
img.research-image { max-height: 300px; max-width: 100%; height: auto; width: auto; display: block; margin: 0 auto; }

/*** page: index ***/
#index-wrapper { font-family: Arial, sans-serif; background: url('/images/blackboard.jpg') no-repeat center center fixed; background-size: cover; }
/* index top (blackboard, PPPL, Theory) */
#index-top { height: 514px; }
#landing-background { height:514px; background-image: url('/images/bg-plasma1.png'); /* initial rotating background img */ }
#landing-logos { position: absolute; top: 0; width: 1200px; height: 514px; margin: 0 auto; text-align: center; }
    #landing-logos img.pppl { width: 220px; margin-top: 80px; }
    #landing-logos div.theory { color: #fff; font-size: 3.6em; line-height: 1.2em; letter-spacing: 15.7px; margin-top: 115px; }
/* top nav */
div[class*="home-nav"] .col-5-1 { padding: 0 5px; text-align: center; }
div[class*="home-nav"] a { text-transform: uppercase; font-size: 20px; font-weight: bold; color: #000; text-decoration: none; border-bottom: none; }
    div[class*="home-nav"] a:hover { color: #fff; }
div.home-nav-top { background-color: #fd6d02; /* orange menu bar */ }
/* bottom nav (images) */
div.home-nav-bottom { margin-top: 5px; background-color: #fff; }
div[class*="home-nav-bottom"] .col-5-1 { padding: 5px; }
div[class*="home-nav-bottom"] img { display: block; width: 230px; height: 145px; }
/* headlines using slick */
#headline-wrapper { font-family: 'Source Serif Pro', serif; background-color:#E8E8E8; border-bottom: #ccc solid 1px; }
.slick-headlines { padding: 10px; }
