 body {
background: #fff;	
margin: 0; 
padding: 0;
font-family: 'Oswald', sans-serif;
font-size: 100%;
overflow-x: hidden;
}

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */

}

body a img {
border: none;
}

body img {
width: auto;
height: auto;
max-width: 100%;
}

a:link { 
text-decoration: none;
color: #006f82;
}

a:visited { 
color: #006f82;
}

a:hover { 
text-decoration: none;
color: #0991a0;
}

a:active { 
text-decoration: none;
color: #0991a0;
}

.clear_float {
clear: both;
padding-top: 20px;
}

h1 {
font-size: 22px;
color: #081a4a;
font-weight: 400;
font-family: 'Oswald', sans-serif;
}

h2 {
font-size: 20px;
color: #081a4a;
font-weight: 400;
font-family: 'Oswald', sans-serif;
}

#subnav_author h2 {
color: #00707e;	
}

h3 {
font-size: 18px;
color: #00707e;	
font-weight: bold;
/* font-family: 'Oswald', sans-serif; */
}

#subnav_author h3 {
font-family: Helvetica, Arial, sans-serif;
color: #00707e;	
}

h4 {
font-size: 16px;
color: #00707e;	
font-weight: 700;
font-family: 'Oswald', sans-serif;
}

#main {
width: auto;
max-width: 100%;
padding-left: 20px;
padding-right: 20px;
/* background: url(/aocs/lipidlibrary/build/images/bkgd_main.png) repeat-x; */
background: #fff;
overflow: hidden;
}

#header {
width: 100%;
height: auto;
min-height: 190px;
margin: 0 auto 40px auto;
background: #fff;
}

#logo {
width: 240px;
margin: 0 auto 10px auto;
}

#search {
clear: both;
width: 300px;	
color: #002b64;
margin: 0 auto 0 auto;
font-size: 14px;
}

.advanced-search-text {
padding-bottom: 40px;	
}

.search-text {
padding-bottom: 7px;	
}


.advanced-search-text {

}

input[type=search] {
-webkit-appearance: none;
border: 1px #666 solid;
width: 249px;
height: 36px;
}

input[type=button] {
-webkit-appearance: none;
border: none;
width: 37px;
height: 37px;
background: #012b65;
color: #ffc010;
margin-left: -2px;
}

#nav {
margin: 10px 0 0 0;	
}


#nav ul {
width: 100%;
list-style: none;
margin-left: -40px;
}


#nav ul li {
width: 100%;	
list-style: none;
color: #fff;
text-align: center;
background: #fff;
padding-top: 10px;
}

#nav ul li:first-child {
width: 100%;		
list-style: none;
color: #fff;

background: #fff;
padding-top: 10px;
}

#nav ul li:last-child {
width: 100%;		
list-style: none;
color: #fff;
padding-left: 0;
background: #fff;
padding-bottom: 20px;
}

#nav ul li a {
list-style: none;
color: #fff;
font-size: 18px;
}

#nav ul li a:link, #nav ul li a:visited {
list-style: none;
color: #00707e;
font-size: 18px;
}

#nav ul li a:hover, #nav ul li a:active {
list-style: none;
color: #012b65;
font-size: 18px;
}

#nav li ul {
display: none;	
}

#intro {
clear: both;	
width: 100%;
height: auto;
margin: 0 auto 0 auto;	
padding: 0 0 0 0;
background: url(/files/LipidsLibrary/images/Img_Large_Bubbles.png) no-repeat top left;
background-size: 300px auto;
}



#intro-content {
padding-left: 0;
}

#callout {
width: 100%;
height: auto;
margin: 15px auto 0 auto;	
background: #d8dfe7; 
padding: 20px 10px 20px 0;
}

#freeform {
clear: both;	
width: 100%;
height: auto;
margin: 0 auto 0 auto;	
background: #fff; 
padding: 10px 10px 20px 0;
}

#news {
clear: both;	
float: left;	
width: 100%;
height: auto;
margin: 15px auto 0 auto;
background: #d8dfe7; 
padding: 20px 10px 20px 0;
}

#footer {
clear: left;		
}

#accordion ul {
list-style: none;
margin-left: 0;
padding-left: 0;
}

#accordion ul li {
margin-left: 0;
padding-left: 0;
}

.date {
font-family: Helvetica, Arial, sans-serif;
color: #006e7f;
font-weight: bold;
margin-top: 30px;
margin-bottom: -10px;
}


.col1 {
clear: right;	
width: 90%;
margin: 0 auto 0 auto;
}


.col1 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}


.col1.box {
clear: right;	
width: 78%;
height: auto;
margin: 0 auto 0 auto;
padding: 5px 18px 18px 18px;
border: #c8c8c8 solid 2px;
background: #fff;
filter: alpha(opacity=80);
opacity:.8;
}

#menu-toggle {
	display: block;
	width: 25px;
	position: absolute;
	right: 0.25em;
	top: 0.25em;
	padding: 6px;
	border: 1px solid #d2dbe1;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #fff;
	background-color: rgba(255,255,255,0.8);
	}
#menu-toggle:hover {
	background-color: #fff;
	background-color: rgba(255,255,255,0.8);
	}
#menu-toggle img {
	display: block;
	width: 100%;
	}


#interior-content {
width: 90%;
margin: 0 auto 40px auto;
font-family: Helvetica, Arial, sans-serif;
font-size: 80%;
}

#interior-content.wide {
width: 90%;
margin: 0 auto 40px 10px;
font-family: Helvetica, Arial, sans-serif;
font-size: 80%;
}

#interior-content h1 {
font-size: 20px;
font-family: 'Oswald', sans-serif;
}

#interior-content h2 {
font-size: 18px;
font-family: 'Oswald', sans-serif;
}

#interior-content p {
font-family: Helvetica, Arial, sans-serif;
line-height: 24px;
}

#interior-content a {
font-weight: bold;
}


#interior-content ul li {
padding-bottom: 10px;
font-size: 100%;
}

#subnav_author {
width: 90%;
height: 100%;
margin: 0 auto 10px 0;
padding: 5px 10px 10px 10px;	
}

#subnav {
width: 90%;
height: 100%;
font-size: 16px;
}

#subnav a {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;	
}


#subnav a.on {
color: #0991a0;
font-weight: bold;
}

#subnav ul {
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
list-style: none;
padding: 0;
margin: 0;
}

#subnav ul li {
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
list-style: none;
padding: 0 0 10px 0;
margin: 0;
}

.breadcrumb {
clear: both;	
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
padding-top: 15px;
padding-bottom: 10px;
width: 92%;
margin: 0 auto 0 10px;
line-height: 18px;
}


#nav-interior {
  margin: 0 -13px 20px -13px;
  padding: 0 20px;}
  #nav-interior > h2 {
    height: 40px;
    line-height: 40px;
    padding: 0 13px;
    padding: 0 1.3rem;
    margin-top: 9px;
    margin-top: 0.9rem;
    font-size: 1.185em;
    background-color: #eeeeee;
    cursor: pointer;
    tabindex: 0;
    position: relative; 
	color: #00707e;}
    #nav-interior > h2:hover {
      background-color: #f8f8f8; color: #00707e;}
    #nav-interior > h2 img {
      display: block;
      width: 12px;
      position: absolute;
      right: 12px;
      top: 50%;
      margin-top: -8px;
      -webkit-transition: all 0.2s ease;
      -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
      -o-transition: all 0.2s ease;
      transition: all 0.2s ease; }
    #nav-interior > h2.active {
      color: #00707e; }
      #nav-interior > h2.active img {
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg); }
  #nav-interior > ul {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; 
	list-style: none;
	margin: 0; 
	padding: 0;}
    #nav-interior > ul a {
      display: block;
      padding: 9px 13px;
      padding: 0.9rem 1.3rem; }
      #nav-interior > ul a.on {
        color: #0991a0; }
    #nav-interior > ul.active {
      padding-bottom: 9px;
      padding-bottom: 0.9rem;
      max-height: 40em;
      background-color: #eeeeee; 
	  }
    #nav-interior > ul .parent-item > a {
      background-color: #aaaaaa;
      font-weight: 700; }
	  
#subnav {
display: none;
}


#widgets {
clear: both;
}

#widgets h2 {
color: #00707e;	
}

#you-might-like {
float: left; 
width: 95%;
margin-right: 0;
margin-bottom: 40px !important;
font-size: 100%;
}

#top-viewed {
float: left; 
width: 95%;
margin-bottom: 40px !important;
font-size: 100%;
}

#you-might-like ul {
list-style: none;	
font-family: Helvetica, Arial, sans-serif;
font-size: 100%;
margin: 0; 
padding: 0;
}

#you-might-like ul li {
list-style: none;	
padding: 0 0 10px 0;
font-size: 100%;
}

#top-viewed ul {
list-style: none;	
font-family: Helvetica, Arial, sans-serif;
font-size: 100%;
margin: 0; 
padding: 0;
}

#top-viewed ul li {
list-style: none;	
padding: 0 0 10px 0;
font-size: 100%;
}

.landing-list-item {
clear: left;	
margin: 20px 0 20px 0;
float: left;
}

.landing-list-content {
width: 100%;
font-family: Helvetica, Arial, sans-serif;
}

.landing-list-title {
font-size: 18px;	
}

.read-more {
clear: both;
margin-top: 10px;
float: right;	
}

.read-more-tight {
clear: both;	
margin-top: 0;
margin-bottom: 40px;
float: right;	
}

.image-right {
float: right;
margin-left: 20px;
}


.titlerow {
background: #00717f;
color: #fff;
}

.alterrow {
background: #eee;	
}

@media all and (max-width: 63em) {
#nav.hidden {
	max-height: 0;
	visibility: hidden;
	margin-top: -60px;
	}
#nav.shown {
		-webkit-transition: max-height 0.3s ease;
		-moz-transition: max-height 0.3s ease;
		-ms-transition: max-height 0.3s ease;
		-o-transition: max-height 0.3s ease;
	transition: max-height 0.3s ease;
	margin-bottom: 16px;
	margin-bottom: 1rem;
	width: 100% !important;
	background-color: #fff;
	}
	

#nav {
}

#nav ul {
padding: 10px 20px 0 0;	
margin: 0 auto 0 auto;
text-align: center;
}

#nav ul li {
list-style: none;
padding: 5px 0 5px 10px;
}

#intro {
clear: left !important;
}


#logo img {
width: 200px;
height: auto;
margin: 0 auto 10px auto;
}

}

@media all and (min-width: 48em) {
	
.landing-photo-right {
float: right;
margin-left: 10px;
}

.landing-photo-left {
float: left;
margin-right: 20px;
}

.landing-list-item {
	clear: left;	
	margin: 20px 0 20px 0;
	float: left;
    width: 100%;
}

.landing-list-content {
float: left;
width: 100%;
font-family: Helvetica, Arial, sans-serif;
}

.landing-list-title {
font-size: 18px;	
}

.read-more {
clear: both;	
margin-top: 10px;
float: right;	
}

.read-more-tight {
clear: both;	
margin-top: 0;
margin-bottom: 20px;
float: right;	
}


#nav-interior {
display: none;	
}

#subnav_author {
display: block;	
float: left;	
width: 250px;
margin: 0 40px 10px 0;
padding: 5px 10px 10px 10px; 
}

#subnav {
display: block;		
font-size: 16px;
}


#interior-container {
width: auto;	
margin: 0 auto 40px auto;
}

#interior-content {
float: left;
width: 60%;
margin-top: 10px !important;
}

#interior-content.wide {
clear: both;	
float: none;
width: 90% !important;
margin-top: 10px !important;
margin-left: 10px;
}


}


 @media all and (min-width: 30em) {

.col1.box {
clear: right;	
width: 83%;
height: auto;
margin: 0 auto 0 auto;
padding: 5px 18px 18px 18px;
border: #c8c8c8 solid 2px;
background: #fff;
filter: alpha(opacity=80);
opacity:.8;
}
	
 }

.col2 {
clear: right;	
width: 90%;
margin: 20px auto 0 auto;
}

.col2.box {
clear: right;	
width: 90%;
margin: 20px auto 0 auto;
}

.col2.box img {
width: 100%;
height: auto;
}

.col2 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}

.more {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 190px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 40px;
}

.more a:link,.more a:visited  {
color: #081a4a;
font-size: 18px;
}

.more a:hover,.more a:active  {
color: #0991a0;
font-size: 18px;
}

.more-short {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 155px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 40px;
}

.more-short a:link,.more-short a:visited  {
color: #081a4a;
font-size: 18px;
}

.more-short a:hover,.more-short a:active  {
color: #0991a0;
font-size: 18px;
}

#footer {
clear: both;	
width: auto;
height: auto;
margin: -20px auto 0 auto;	
background: #00707e;
}


#footer .connect {
color: #ffc010;
font-size: 16px;
font-weight: 400;
margin: 0 auto 0 auto !important;
padding: 30px 0 0 0;
width: 180px;
text-align: center;
}

#footer .connect-icon {
padding: 10px 0 10px 0;	
}

#footer .contact {
width: 200px;	
font-family: Helvetica, Arial, sans-serif;
color: #fff;
font-size: 14px;
line-height: 30px;
text-align: center;
margin: 0 auto 0 auto;
}


#footer #contact-content {
line-height: 18px;	
}

#footer .contact a:link, #footer .contact a:visited {
font-family: Helvetica, Arial, sans-serif;
color: #ffc010;
font-size: 14px;
padding: 0 0;
}

#footer .contact a:hover, #footer .contact a:active {
font-family: Helvetica, Arial, sans-serif;
color: #fff;
font-size: 14px;
padding: 0 0;
}

#footer .contact ul {
padding-top: 20px;	
list-style: none;	
}

#footer .contact ul li {
list-style: none;	
text-align: center;
color: #00707e;
} 

 @media all and (min-width: 30em) {
	 
#footer .contact {
width: 90%; 
}

#footer #contact-content {
line-height: 30px;	
}


.just-mobile {
display: none;	
}

 }


 @media all and (min-width: 48em) {

#nav {
display: block;	
}

  #mobile-nav, .mobile-menu-toggle, .js .mobile-menu-toggle {
    display: none; }

#intro {
width: 100%;
height: auto;
margin: 0 auto 0 auto;	
padding: 10px 0 0 0;
background: url(/files/LipidsLibrary/images/Img_Large_Bubbles.png) no-repeat top left;
}

#intro-content {
padding-left: 0;
}

#callout {
width: 100%;
height: auto;
margin: 15px auto 0 auto;	
background: #d8dfe7; 
padding: 20px 10px 20px 0;
}


#freeform {
width: 100%;
height: auto;
margin: 0 auto 0 auto;	
padding: 10px 10px 20px 0;
}



#news {
width: 100%;
height: auto;
margin: 15px auto 0 auto;
}


.date {
font-family: Helvetica, Arial, sans-serif;
color: #006e7f;
font-weight: bold;
margin-top: 30px;
margin-bottom: -10px;
}


.col1 {
clear: right;	
width: 90%;
margin: 0 auto 0 auto;
}


.col1 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}


.col1.box {
clear: right;	
width: 84%;
height: auto;
margin: 0 auto 0 auto;
padding: 5px 18px 18px 18px;
border: #c8c8c8 solid 2px;
background: #fff;
filter: alpha(opacity=80);
opacity:.8;
}

.col2 {
clear: right;	
width: 90%;
margin: 20px auto 0 auto;
}

.col2.box {
clear: right;	
width: 90%;
margin: 20px auto 0 auto;
}

.col2.box img {
width: 100%;
height: auto;
}

.col2 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}

#footer {
clear: both;	
}

 }


@media all and (min-width: 63em) {

.landing-list-content {
float: left;
width: 100%;
font-family: Helvetica, Arial, sans-serif;
}	

#you-might-like {
float: left; 
width: 47%;
margin-right: 40px;
margin-bottom: 40px !important;
}

#top-viewed {
float: left; 
width: 47%;
margin-bottom: 40px !important
}	
	
#main {
width: 100%;
background: #fff;
overflow: hidden;
}

	
#main.interior {
width: 100%;
background: #fff;
overflow: hidden;
}

#header {
width: 100%;
height: 206px;
min-height: 0;
margin: 0 auto;
}

#logo {
float: left;
width: 240px;
margin: 0 auto 0 auto;
padding-left: 0;
}

#search {
position: absolute;
top: 20px;
right: 20px;
width: 300px;	
color: #002b64;
font-size: 14px;
}

.search-text {
padding-bottom: 7px;	
}

input[type=search] {
-webkit-appearance: none;
border: 1px #666 solid;
width: 249px;
height: 36px;
}

input[type=button] {
-webkit-appearance: none;
border: none;
width: 37px;
height: 37px;
background: #012b65;
color: #ffc010;
margin-left: -2px;
}

#nav {
margin: 0 0 0 20px;	
}


#nav ul {
clear: both;	
width: auto;	
float: left;
list-style: none;
margin-left: -60px;
}


#nav ul li {
width: auto;	
float: left;
list-style: none;
color: #fff;
padding-top: 0;
padding-left: 40px;
}

#nav ul li:first-child {
width: auto;		
float: left;
list-style: none;
color: #fff;
padding-left: 0;
background: none;
padding-top: 0;
}

#nav ul li:last-child {
width: auto;		
padding: 0 0 0 40px;
}


#nav ul li a {
float: left;
list-style: none;
color: #00707e;
font-size: 18px;
}

#nav ul li a:link, #nav ul li a:visited {
float: left;
list-style: none;
color: #00707e;
font-size: 18px;
}

#nav ul li a:hover, #nav ul li a:active {
float: left;
list-style: none;
color: #ffc40e;
font-size: 18px;
}

#nav ul li a.on:link, #nav ul li a.on:visited {
float: left;
list-style: none;
color: #012b65;
font-size: 18px;
}

#nav ul li a.on:hover, #nav ul li a.on:active {
float: left;
list-style: none;
color: #012b65;
font-size: 18px;
}


#nav {
margin: 0;
padding: 0;
z-index: 1100;  /* http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/ */
width: 980px;
}


#nav, #nav ul { /* all lists */
		position: absolute;
		top: 75px;
		left: 7px;
		clear: both;
		float: left;
		padding: 0 0 0 20px;
		margin: 0 auto 0 auto;
		list-style: none;
		padding-top: 0;
}


#nav li { /* all list items */
		float: left;
		font-size: 20px;
  		font-weight: normal;
		padding: 0;
  		margin: 0;
		z-index: 1000;
}

#nav li ul { /* second-level lists */
		position: absolute;
		left: -999em;
		width: 185px;
		padding: 20px 20px 20px 20px;
		margin: 0 0 0 0; 
		display: block;
		z-index: 1000 !important;
		background-color: #00717f;
		/* background-color: rgba(255,255,255); */
		opacity:0.9;
		filter:alpha(opacity=90); /* For IE8 and earlier */
		float: left;
		}		

#nav li ul li {
		padding: 0 0 5px 0;
		margin: 0;
		width: 205px;
		display: block;
	    z-index: 1000;
		font-size: 14px;
		background: none;
		text-align: left;
		color: #fff;	
		}		

#nav li ul li:hover {
color: #fdbf13;	
padding: 0 0 5px 0;
		}	
		
#nav li ul li:first-child {
color: #fff;	
width: auto;		
padding: 0 0 5px 0;
background: none;
}


#nav li ul li:first-child:hover {
color: #fdbf13;
width: auto;		
padding: 0 0 5px 0;
background: none;
}

#nav li ul li:last-child {
width: auto;		
padding: 0 0 0 0;
background: none;
}

#nav li ul li a:link,  #nav li ul li a:visited,  #nav li ul li a:active {
  		color: #fff;
		font-size: 14px;
  		font-weight: normal;
		line-height: 30px;
		padding: 0 0 10px 3px;
		margin: 0;
		text-align: left;
		display: block;
		font-size: 12px;
}
		
#nav li ul li a:hover {
		color: #ffc40e;
		font-size: 11px;
  		font-weight: normal;
		line-height: 30px;
		padding: 0 0 10px 3px;
		margin: 0;
		text-align: left;
		display: block;
		font-size: 12px;
}

/* aligns the last navigation flyout right so it doesn't break out of the container */

#nav li:hover ul.firstone {
    left: 7px;
	}
	
#nav li:hover ul ul, #nav li.over ul ul, #nav li.over ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li.over ul, #nav li li.over ul {
	left: auto;
	top: 25px;
}

#intro {
width: 1050px;
height: 331px;
margin: 0 auto 0 auto;	
padding: 80px 0 0 0;
background: url(/files/LipidsLibrary/images/Img_Large_Bubbles.png) no-repeat left;
}

#intro-content {
padding-left: 20px;
}

#callout {
width: 970px;
height: 205px;
margin: 0 auto 0 auto;		
background: none;
padding: 0;
}

#freeform {
width: 970px;
height: auto;
margin: 25px auto 0 auto;		
background: none;
padding: 0;
}


#news {
clear: both;	
float: none;	
width: 970px;
height: 488px;
margin: 20px auto 0 auto;	
background: none;
padding: 0;
}


.date {
font-family: Helvetica, Arial, sans-serif;
color: #006e7f;
font-weight: bold;
margin-top: 30px;
margin-bottom: -10px;
}


.col1 {
clear: none;	
float: left;
width: 445px;
margin: 0 57px 0 0;
}


.col1 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}


.col1.box {
clear: none;		
float: left;
width: 390px;
height: 232px;
margin: 0 47px 0 0;
padding: 5px 18px 18px 18px;
border: #c8c8c8 solid 2px;
background: #fff;
filter: alpha(opacity=80);
opacity:.8;
}


.col2.box img {
width: auto;
height: auto;
}


.col2 {
clear: none;		
float: left;
width: 445px;
margin: 0;
}

.col2.box {
clear: right;	
width: auto;
margin: 0 auto 0 0;
}

.col2.box img {
width: 100%;
height: auto;
}

.col2 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}

.more {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 190px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 0;
}

.more a:link,.more a:visited  {
color: #081a4a;
font-size: 18px;
}

.more a:hover,.more a:active  {
color: #0991a0;
font-size: 18px;
}

.more-short {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 155px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 0;
}

.more-short a:link,.more-short a:visited  {
color: #081a4a;
font-size: 18px;
}

.more-short a:hover,.more-short a:active  {
color: #0991a0;
font-size: 18px;
}

#interior-container {
width: 100%;	
margin: 0 auto 40px auto;
}


#interior-content {
float: left;	
width: 70%;
margin: 0 20px 40px 0;
}


#interior-content.wide {
clear: both;	
float: none;
width: 90%;
margin-left: 20px;
}



#interior-content p {
font-family: Helvetica, Arial, sans-serif;
line-height: 24px;
}

.breadcrumb {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
padding-top: 10px;
width: auto;	
margin: 0 auto 0 20px;
}

#subnav_author {
float: left;
width: 200px;
height: 100%;	
}

#subnav {
margin: 0 40px 10px 0;
font-size: 16px;
padding: 5px 10px 10px 10px; 
}

#subnav_author h2 {
color: #00707e;	
}

#subnav_author h3 {
font-family: Helvetica, Arial, sans-serif;
color: #00707e;	
}

#subnav a {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;	
}


#subnav a.on {
color: #0991a0;
font-weight: bold;
}

#subnav ul {
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
list-style: none;
padding: 0;
margin: 0;
}

#subnav ul li {
font-family: Helvetica, Arial, sans-serif;
font-size: 16px;
list-style: none;
padding: 0 0 10px 0;
margin: 0;
}

#footer-container {
background: #00707e;
width: 100%;
clear: both;
}

#footer {
width: 90%;
height: 111px;
margin: -20px auto 0 auto;	
}


#footer.interior {
width: 90%;
height: 111px;
margin: 20px auto 0 auto;	
padding-top: 10px;
}

#footer .connect {
color: #ffc010;
font-size: 16px;
font-weight: 400;
margin: 0 !important;
padding: 30px 0 0 0;
width: 90%;
text-align: left;
}

#footer .connect-icon {
padding-top: 10px;	
}

#footer .connect img {
padding-right: 6px;	
}

#footer .contact {
width: auto;
float: right;	
font-family: Helvetica, Arial, sans-serif;
color: #fff;
font-size: 14px;
line-height: 30px;
text-align: right;
}

#footer .contact a {
font-family: Helvetica, Arial, sans-serif;
color: #ffc010;
font-size: 14px;
padding: 0 10px !important;
}

#footer .contact ul {
float: left;	
padding-top: 0;	
margin-top: 0;
margin-right: -40px;
list-style: none;	
}

#footer .contact ul li {
width: auto;	
list-style: none;	
float: left;	
color: #fff;
text-align: right;
} 


#footer .contact ul li a {
width: auto;	
list-style: none;	
float: left;	
color: #fff;
text-align: right;
padding: 0 10px;
} 

#contact-content {
float: left;	
}


#menu-toggle {
	display: none; 
 }
 

}


@media all and (min-width: 68em) {


.landing-list-content {
width: 100%;
}	

#main {
width: 100%;
background: url(/files/LipidsLibrary/images/bkgd_main.png) repeat-x;
overflow: hidden;
}

#header {
width: 100%;
height: 156px;
margin: 0 auto;
}

#logo {
float: left;
width: 240px;
margin: 0 auto 0 auto;
}

#search {
position: absolute;
top: 20px;
right: 20px;
width: 300px;	
color: #002b64;
font-size: 14px;
}

.search-text {
padding-bottom: 7px;	
color: #012b65;
}

input[type=search] {
-webkit-appearance: none;
border: 1px #666 solid;
width: 249px;
height: 36px;
}

input[type=button] {
-webkit-appearance: none;
border: none;
width: 37px;
height: 37px;
background: #012b65;
color: #ffc010;
margin-left: -2px;
}

#nav {
margin: 10px 0 0 0;	
}


#nav ul {
width: auto;	
float: left;
list-style: none;
margin-left: -30px;
margin-top: 15px;
}


#nav ul li {
width: auto;	
float: left;
list-style: none;
color: #fff;
padding-top: 0;
padding-left: 40px;
}

#nav ul li:first-child {
width: auto;		
float: left;
list-style: none;
color: #fff;
background: none;
padding-top: 0;
}

#nav ul li:last-child {
width: auto;		
padding: 0 0 0 40px;
}


#nav ul li a {
float: left;
list-style: none;
color: #00707e;
font-size: 18px;
}

#nav ul li a:link, #nav ul li a:visited {
float: left;
list-style: none;
color: #00707e;
font-size: 18px;
}

#nav ul li a:hover, #nav ul li a:active {
float: left;
list-style: none;
color: #012b65;
font-size: 18px;
}


/* flyouts */

#nav {
margin: 0;
padding: 0;
z-index: 1100;  /* http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/ */
width: 1000px;
}


#nav, #nav ul { /* all lists */
		position: absolute;
		top: 75px;
		left: 10px;
		clear: both;
		float: left;
		padding: 0 0 0 20px;
		margin: 0 auto 0 auto;
		list-style: none;
		padding-top: 0;
}


#nav li { /* all list items */
		float: left;
		font-size: 20px;
  		font-weight: normal;
		padding: 0;
  		margin: 0;
		z-index: 1000;
}

#nav li ul { /* second-level lists */
		position: absolute;
		left: -999em;
		width: 185px;
		padding: 20px 20px 20px 20px;
		margin: 0 0 0 0; 
		display: block;
		z-index: 1000 !important;
		background-color: #00717f;
		/* background-color: rgba(255,255,255); */
		opacity:0.9;
		filter:alpha(opacity=90); /* For IE8 and earlier */
		float: left;
		}		

#nav li ul li {
		padding: 0 0 5px 0;
		margin: 0;
		width: 205px;
		display: block;
	    z-index: 1000;
		font-size: 14px;
		background: none;
		text-align: left;
		color: #fff;	
		}		

#nav li ul li:hover {
color: #fdbf13;	
padding: 0 0 5px 0;
		}	
		
#nav li ul li:first-child {
color: #fff;	
width: auto;		
padding: 0 0 5px 0;
background: none;
}


#nav li ul li:first-child:hover {
color: #fdbf13;
width: auto;		
padding: 0 0 5px 0;
background: none;
}

#nav li ul li:last-child {
width: auto;		
padding: 0 0 0 0;
background: none;
}

#nav li ul li a:link,  #nav li ul li a:visited,  #nav li ul li a:active {
  		color: #fff;
		font-size: 14px;
  		font-weight: normal;
		line-height: 30px;
		padding: 0 0 5px 3px;
		margin: 0;
		text-align: left;
		display: block;
}
		
#nav li ul li a:hover {
		color: #ffc30e;
		font-size: 14px;
  		font-weight: normal;
		line-height: 30px;
		padding: 0 0 5px 3px;
		margin: 0;
		text-align: left;
		display: block;
}

/* aligns the last navigation flyout right so it doesn't break out of the container */


#nav li:hover ul.lastone {
    right: 0;
	}

#nav li:hover ul.firstone {
    left: 7px;
	}

#nav li li, #nav li li a { 
	float: none !important; 
	}
	
#nav li:hover ul ul, #nav li.over ul ul, #nav li.over ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li.over ul, #nav li li.over ul {
	left: auto;
	top: 25px;
}

.breadcrumb {
padding-top: 40px;	
}

#intro {
width: 1050px;
height: 300px;
margin: 0 auto 0 auto;	
padding: 80px 0 0 0;
background: url(/files/LipidsLibrary/images/Img_Large_Bubbles.png) no-repeat left;
}


#intro-content {
padding-left: 20px;
}

#callout {
width: 1024px;
height: 205px;
margin: 0 auto 0 auto;		
background: none;
padding: 0;
}

#freeform {
clear: both;	
width: 1024px;
height: auto;
margin: 25px auto 0 auto;		
background: none;
padding: 0;
}


#news {
width: 1024px;
height: 488px;
margin: 20px auto 0 auto;	
}


.date {
font-family: Helvetica, Arial, sans-serif;
color: #006e7f;
font-weight: bold;
margin-top: 30px;
margin-bottom: -10px;
}


.col1 {
clear: none;	
float: left;
width: 450px;
margin: 0 57px 0 0;
}


.col1 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}


.col1.box {
clear: none;		
float: left;
width: 390px;
height: 232px;
margin: 0 72px 0 0;
padding: 5px 18px 18px 18px;
border: #c8c8c8 solid 2px;
background: #fff;
filter: alpha(opacity=80);
opacity:.8;
}


.col2.box img {
width: auto;
height: auto;
}


.col2 {
clear: none;		
float: left;
width: 50%;
margin: 0;
}

.col2.box {
clear: right;	
width: auto;
margin: 0 auto 0 0;
}

.col2.box img {
width: 100%;
height: auto;
}

.col2 p {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
}

.more {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 190px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 0;
}

.more a:link,.more a:visited  {
color: #081a4a;
font-size: 18px;
}

.more a:hover,.more a:active  {
color: #0991a0;
font-size: 18px;
}

.more-short {
background: url(/files/LipidsLibrary/images/Img_Link_Bubbles.png) left no-repeat;
width: 155px;
height: 33px;
float: right;
text-align: right;
padding-top: 12px;
margin-bottom: 0;
}

.more-short a:link,.more-short a:visited  {
color: #081a4a;
font-size: 18px;
}

.more-short a:hover,.more-short a:active  {
color: #0991a0;
font-size: 18px;
}

.new {
padding: 0 3px 0 7px;	
vertical-align: top;
}


#footer {
width: 1024px;
height: 111px;
margin: -20px auto 0 auto;	
}


#footer.interior {
width: 90%;
height: 111px;
margin: 20px auto 0 auto;	
padding-top: 10px;
}

#footer .connect {
color: #ffc010;
font-size: 16px;
font-weight: 400;
margin: 0;
padding: 60px 0 0 0 !important;
width: auto;
}

#footer .connect {
padding-top: 0;	
}

#footer .connect img {
padding-right: 6px;	
}


#footer .connect-icon {
padding-top: 0;	
vertical-align: middle;
}

#footer .contact {
width: auto;
float: right;	
font-family: Helvetica, Arial, sans-serif;
color: #fff;
font-size: 14px;
line-height: 30px;
text-align: right;
}

#footer .contact a {
font-family: Helvetica, Arial, sans-serif;
color: #ffc010;
font-size: 14px;
padding: 0 10px !important;
}

#footer .contact ul {
float: left;	
padding-top: 0;	
margin-top: 0;
margin-right: -40px;
list-style: none;	
}

#footer .contact ul li {
width: auto;	
list-style: none;	
float: left;	
color: #fff;
text-align: right;
} 


#footer .contact ul li a {
width: auto;	
list-style: none;	
float: left;	
color: #fff;
text-align: right;
padding: 0 10px;
} 

#contact-content {
float: left;	
}

 }
 
 .author {
font-size: 12px;
font-weight: normal;
font-family: Helvetica, Arial, sans-serif;
margin-top: 20px;
width: 100%;
}

.author p {
line-height: 24px;	
}

@media all and (min-width: 68em) {

.author {
font-size: 12px;
font-weight: normal;
font-family: Helvetica, Arial, sans-serif;
margin-top: 40px;
margin-left: 10px;
width: 200px;
}

}

.credentials {
color: #012c66;
font-weight: bold;
}


/* SEARCH STYLING */

#SearchForm input#searchData {
width: 150px !important;	
}

.page-links a {
float: left;	
margin-right: 10px;
padding: 5px;
background: #0e717e;
color: #fff;
font-weight: bold;
display: block;
text-align: center;
margin-bottom: 20px;
margin-top: 20px;
}

#keySearchYes {
float: left;
margin-right: 10px;
background: #042d63;
color: #fff;
font-weight: bold;
display: block;
padding: 5px;
text-align: center;
margin-top: 20px;
}

.result-summary #keySearchYes {
float: none;
display: inline;
padding: 0;
margin-right: 0;
}

#keySearchYes.keyword-callout {
color: #042d63;	
background: #fff;
}

.result {
clear: left;	
}


.result p {
padding-top: 0;
margin-top: -12px;
line-height: 12px;
}

@media all and (max-width: 775px) {

	#nav-interior {
	    margin: 0 -13px;
	    padding: 0 20px;
	}

}