/*
   Styles for NPNL section

      Light: #598FD1
       Dark: #265C9E
*/

/* General styles. */

body { font-family: helvetica, arial, sans-serif; margin: 0; }
img, table, tr, td, div, a, form { border: 0; padding: 0; margin: 0; }
a { text-decoration: none; color: black; }


/* Main page container. */

#container { width: 100%; margin: auto; background-color: white; }


/* Content fixed at top of page. */

#topofpage { width: 100%; position: fixed; top: 0; }


/* Section banner. */

#section-banner { font-family: futura-pt, helvetica, arial; padding-top: 125px; margin-bottom: 30px; }
#section-banner img { width: 100%; }
#section-banner #imagetoggle { float: right; margin: 5px 10px 5px 10px; }
#section-banner #imagetoggle a { text-decoration: none; background-color: #eeeeee; padding: 2px 4px 2px 4px;
                                 border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
#section-banner #imagetoggle a:hover { background-color: #cccccc; }
#section-banner #aboutthisimage { margin: 5px 10px 5px 10px; }
#section-banner #aboutthisimage span { font-style: italic; padding: 2px 0px 2px 0px; }
#section-banner #aboutthisimage a { background-color: #eeeeee; padding: 2px 4px 2px 4px;
                                    border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
#section-banner #aboutthisimage a:hover { background-color: #cccccc; }


/* Content. */

#content { font-family: futura-pt, helvetica, arial;
           width: 800px; margin: 30px auto 50px auto; }

#content-twitter { float: right; width: 400px; margin-bottom: 50px; }
#content-text { /* margin-right: 450px; */ }

#content h1 { font-size: 240%; font-weight: 500;
              margin-top: 0.75em; margin-bottom: 0.75em; line-height: 120%; color: black; }

#content h2 { font-size: 200%; font-weight: 500;
              margin-top: 1.5em; margin-bottom: 0.75em; line-height: 140%; color: black; }

#content h3 { font-size: 160%; font-weight: 500;
              margin-top: 1.5em; margin-bottom: 0.75em; line-height: 140%; color: black; }

#content h4 { font-size: 130%; font-weight: 500;
              margin-top: 1.5em; margin-bottom: 0.75em; line-height: 140%; color: black; }

#content p, #content li, #content blockquote { font-weight: 300; line-height: 150%; color: #333333; }
#content p, #content li { font-size: 120%; }
#content b, #content strong { font-weight: 500; }
#content li li, #content li li li, #content blockquote { font-size: 100%; }
#content a { text-decoration: none; background-color: #eeeeee; font-weight: 500; padding: 2px 4px 2px 4px;
             border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
#content a:hover { background-color: #cccccc; }


/* Icon navigation blocks. */

#content #icon-navigation { display: flex; flex-direction: column; align-items: flex-start; text-align: center; }
#content .icon-nav { text-align: center; }
#content #icon-navigation img { width: 100%; opacity: 0.75; filter: alpha(opacity=75); }
#content #icon-navigation img:hover { opacity: 1.0; filter: alpha(opacity=100); }
#content #icon-navigation p { font-weight: 500; }
#content #icon-navigation a { background-color: white; }
@media (min-width: 800px)
   { #content #icon-navigation { flex-direction: row; justify-content: space-between; }
     #content .icon-nav { flex-basis: 30%; }
     #content #icon-navigation img {  }
   }


/* Styles for mini-bios. */

#content .people { width: 100%; margin-bottom: 2em; }
#content .people p { margin: 0; padding: 0; line-height: 140%; }
#content .people a { font-weight: 300; }

#content .people td.person { width: 33%; vertical-align: top; padding: 10px 15px 10px 15px; }
#content .people td.person img:hover { opacity: 0.75; filter: alpha(opacity=75); }
#content .people td.person a { background-color: inherit; }
#content .people td.person .personname { font-weight: 500; font-size: 140%; }
#content .people td.person .personlinks a { font-weight: 300; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
#content .people td.person .personlinks a:hover { background-color: #dddddd; }

#content .people .personbio td { background-color: #eeeeee; padding: 0.5em 1em 0.5em 1em; }
#content .people .personbio td p { margin: 0.5em 0 0.5em 0; }


/* Styles for NPNL contact form. */

#npnlcontactform input[type="text"], textarea { font-family: futura-pt; font-size: 100%; font-weight: 200; width: 95%;
                                                border: 1px solid #cccccc; padding: 3px; }
#npnlcontactform input[type="text"].additional { width: auto; }
#npnlcontactform input:focus, textarea:focus { background-color: #ffff99; }

#npnlcontactform table.toplevel { width: 100%; font-size: 120%; line-height: 125%;
                                  margin-top: 1em; margin-bottom: 1em; }
#npnlcontactform td { vertical-align: top; }
#npnlcontactform td.label { width: 35%; text-align: right; padding: 5px; }
#npnlcontactform td.required { color: #990000; font-weight: 500; }
#npnlcontactform td.value { width: 65%; text-align: left; padding: 5px; }
#npnlcontactform #Your_URL { display: none; }
#npnlcontactform fieldset { border: 0; }


/* Styles for APA/publication list. */

#content p.apa { padding-left: 0.25in; text-indent: -0.25in; }
@media (min-width: 768px) { #content p.apa { padding-left: 0.5in; text-indent: -0.5in; } }
#content div.abstract { padding: 0.5em 1em; background-color: #f0f0f0; }
#content div.abstract p { padding: 0.5em 0; margin: 0; }
#content .hide-abstract { display: none; }
#content .hidden { display: none; }
#content .hide { display: none; }


/* Footer overrides. */

#footer { font-family: futura-pt; }