
@import url(/inc/forms.css);
@import url(/inc/calendar.css);

.expired, .expired * {
    color: orange !important;
}
.unpublished, .unpublished * {
    color: red !important;
}
#main .expired {
    background-image: url(/chrome/expired.png);
    background-repeat: no-repeat;
    background-position: 460px 10px;
}
#main .unpublished {
    background-image: url(/chrome/unpublished.png);
    background-repeat: no-repeat;
    background-position: 400px 10px;
}

.bordergreen{
    border:1px Solid #306b61;
    padding:5px;
}


.borderyellow{
    border:1px Solid #F3C75B;
    padding:5px;
}

.backgreen{
    background:#306b61;
    padding:5px;
color:#fff;
}



.backgreen a:hover{
color:#fff;
}

.backyellow{
    background:#F3C75B;
    padding:5px;
color:#fff;
}

.backgray{
    background:#e8e8e8;
    padding:5px;
color:fff;
}


html {
    margin: 0;
    padding: 0;
}
body {
    background-color: #f1f2f3; 
    margin: 0;
    padding: 0;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 70%;
    /* color: #504e53; */
    color: #838383;
}

#print{
height:15px;
float:left;
margin-left:200px;
margin-top:20px;
/*padding-left:25px;
background-image:url('/chrome/printer.gif')         */

}     

#float_logo{
float:left;
}
a:link {
    text-decoration: none;
    color: #306b61;
    font-weight: bold;
}
a:visited {
    text-decoration: none;
    color: #306b61;
    font-weight: bold;
}
a:hover {
    text-decoration: underline;
}
img { border: none; }
.hide { display: none; }

hr {
    border: none;
    border-bottom: 1px solid #F3C75B;
    height: 0;
    margin-bottom: 1em;
}
.hr {
    height: 0;
    overflow: hidden;
    padding-bottom: 1px;
    margin-bottom: 1em;
    background: #F3C75B;
}


/** text sizing **/
.size2 {
    font-size: 90%;
}
.size3 {
    font-size: 110%;
}


.text a:link, .text a:visited {
   /* float:left;   */
	color: #306b61;
    text-decoration: underline;
    font-weight: normal;
}

.text2{
float:left;
    color: #306b61;
    text-decoration: underline;
    font-weight: normal;
}

#page {
    width: 985px;
    margin-left: auto;
    margin-right: auto;
}
#header {
    padding-left: 10px;
    background: #fff;
    position: relative;
    height: 65px;
    padding-top: 10px;
    border-bottom: 2px solid #306b61;
}
#printlogo { display: none; }

#content-container {
    overflow: hidden;
    width: 960px;
    padding: 0 15px 0 10px;
    line-height: 140%;
    background-color: #e8e8e8; 
    /* background-color: #ffffff; */
    border-bottom: 10px solid #fff;
}
#navigation {
    width: 140px;
    float: left;
    background-color: #e8e8e8; 
    /* background-color: #ffffff; */
    overflow: hidden;
/*    padding-left:10px;*/
    padding-right:10px;
}
#page-functions {
    position: relative;
    width: 955px; 
    float:left;
}
#page-functions ul {
    position: absolute;
    bottom: 40px; 
    right: 0px; 
    margin: 0;
    padding: 0;
    list-style: none;
}
#page-functions li {
    display: block;
    float: left;
    padding: 0;
    margin: 0;
}
#page-functions a {
    display: block;
    margin: 0 5px 0 0;
    float: left;
    background-position: top left;
    background-repeat: no-repeat;
    height: 15px;
    overflow: hidden;
    text-indent: -100em;
}
#page-functions a:hover {
    text-decoration: none;
    background-position: -30px -30px;
}
#page-functions-home        { width: 17px; background: url(/chrome/icon.home.png) no-repeat top left; }
#page-functions-sitemap     { width: 19px; background: url(/chrome/icon.sitemap.png) no-repeat top left; }
#page-functions-tip         { width: 26px; background: url(/chrome/icon.tip.png) no-repeat top left; }
#page-functions-subscribe   { width: 16px; background-image: url(/chrome/icon.subscribe.png); }
#page-functions-textsize    { width: 23px; background-image: url(/chrome/icon.textsize.png); }
#page-functions-contact     { width: 14px; background-image: url(/chrome/icon.contact.png); }


#maincontent {
    width: 600px;
    float: left;
    background-color: #fff;
    overflow: hidden;
    border-left: 10px solid #fff; /* don't want yet another container, så simulate padding with borders. */
    border-right: 10px solid #fff;
    padding-top:15px;
}
#maincontent p {
    /* font-size: 110%; */
}

#subcontent {
    width: 170px;
    float: left;
    height: 35em;
    font-size: 90%;
    line-height: 140%;
    color: #687a7f;
    padding-top: 15px;
    padding-left:15px;
    padding-right:5px;
}
#subcontent[id] {
    height: auto;
    min-height: 35em;
}


#shortcuts {
    /* margin: 2em 20px 1em 20px; */
    margin: 2em 0px 1em 0px; 
}
#shortcuts select {
    /*
    width: 135px;
    wid\th: 100%;
    */
}
#shortcuts p {
    margin: 0 0 1em 0;
}


#mainimage {
    position: relative;
    border: 1px solid #c3c5c8;
    width: 598px;
    color: #4f5e62;
    margin-bottom: 1em;
}
#mainimage img {
    width: 598px;
    display: block;
}
#mainimage p {
    position: absolute;
    font-weight: bold;
    left: 0;
    bottom: 0;
    padding: .5em 19px;
    margin: 0;
    width: 560px;
    background: url(/chrome/a75.png);
}

#mainhead {
    padding: 0 20px;
    height: 0.5em;
}
#mainhead .date {
/*    
    padding: 1em 0 0 0;
    margin: 0;
    line-height: normal;
    position:relative;
    */
}

#main {
    width: 580px;
    padding: 0 10px;
    height: 32em;
}
#main[id] {
    height: auto;
    min-height: 32em;
}
#main h1 {
    font-size: 135%;
    font-weight: bold;
    margin: 1em 0 1em 0;
    color: #306B61; 
}
#main h2 {
    font-size: 110%;
    color: #306B61;
    margin: 1em 0 1em 0;
    font-weight: bold;
}
#main h3 {
    color: #737373;
    font-size: 100%;
    font-weight: bold;
}
#main .intro {
    /* color: #434244; */
}
#main .block {
    overflow: hidden;
    width: 100%;
}
#main .text {
    width: 368px;
    position: relative;
    color: #687a7f
}
.image {
    position: relative;
    overflow: hidden;
}
#main .image {
    width: 174px;
    overflow: hidden;
    padding-top: 3px; /* Align text with image */
}
#main .PEwi .image {
    width: 560px;
}
#main .image img {
    display: block;
    border: 1px solid #c3c5c8;
}
#main .image p {
    margin: 1em 0 0 0;
    padding: 0 5px 0 5px;
    font-style: italic;
    font-size: 90%;
    height: 33px;
    color: #687A7F;
}
#main .image p.caption1 { /* background-image: url(/chrome/image.caption.molecules1.png); */ }
#main .image p.caption2 { /* background-image: url(/chrome/image.caption.molecules2.png); */ }
#main .image p.caption3 { /* background-image: url(/chrome/image.caption.molecules3.png); */ }
#main[id] .image p {
    height: auto;
    min-height: 33px;
}
#main .imageleft .image {
    float: left;
}
#main .imageleft .text {
    float: right;
}
#main .text > p:first-child {
    margin-top: 0;
}
#main .imageright .image {
    float: right;
}





.columns {
    overflow: hidden;
    width: 560px;
}
.columns .column {
    float: left;
    width: 176px;
    margin-right: 16px;
}
.columns .column.last {
    margin-right: 0;
}
#main .columns .text {
    margin-top: 1em;
    width: 176px;
}

#breadcrumb {
    /* background: url(/chrome/dashed.horizontal.red.png) repeat-x top left; */
    border-top: 1px solid #F3C75B;
    border-bottom: 1px solid #F3C75B;
    padding: .5em 20px;
    margin-top: 1em;
}
#breadcrumb ul, #breadcrumb li {
    margin: 0;
    padding: 0;
    list-style: none;
}
#breadcrumb li {
    margin: 0;
    display: inline;
    padding-left: 10px;
    background: url(/chrome/breadcrumb.pil.png) no-repeat 0 .45em;
    color: #306b61;
}
#breadcrumb a {
    font-weight: normal;
    color: #306b61;
}
#breadcrumb .active a {
    font-weight: bold;
}
#information {
    margin: .5em 20px;
    color: #306b61;
}
#information a {
    color: #306b61;
}

#information p,
#information-print p {
    margin: 0;
}
#information span,
#information-print span {
    background: url(/chrome/circle.orange.png) center center no-repeat;
    padding-left: 15px;
}
#information-print {
    display: none;
}



#subcontent .block {
    margin-bottom: 1.5em;
    width: 168px;
    overflow: hidden;
    /* border: 1px solid #f3c75b; */
}
#subcontent h2 {
    padding: .3em 10px;
    font-size: 100%;
    font-weight: bold;
    color: #306b61;
    background-color: #e8e8e8;
    border-bottom:solid 1px #F3C75B;
    margin: 0 0 0 0;
}
#subcontent h2 a {
   color: #306b61;
    text-decoration:none;
    
}
#subcontent h3 {
    font-weight: bold;
    font-size: 100%;
    margin: 0;
}
#subcontent .image {
    /*border: 1px solid #c3c5c8; 
    border: 1px solid #f3c75b;*/
    margin-top: .3em;
    width: 163px;
}
#subcontent .image p {
    padding: 1em 15px;
    margin: 0;
    background: #edeff0;
}
#subcontent .image img {
    display: block;
}
#subcontent .text {
    /*border: 1px solid #f3c75b;*/
    padding: 0 1em;
    margin-top: .3em;
}
#subcontent .block ul, #subcontent .block ol {
    margin: 1em 0;
    padding: 0;
    list-style: none;
}
#subcontent .block li {
    margin-bottom: .5em;
}
#subcontent .block ol {
    padding-left: 20px;
    list-style: decimal;
}



#subcontent .list  .listimage {
	position: relative;
    left: -15px;
    margin-bottom: .2em;
}
#main .list {
    overflow: visible;
}
#main .list ul {
    width: 100%;
    float:left
}
#main .list li {
    overflow: hidden;
    width: 100%;
}
#main .list .listimage {
    position: relative;
    float: right;
    width: 172px;
    overflow: hidden;
}

#main .list .listimage2 {
margin:0px;
padding:0px;
    float: right;
    width: 172px;
    overflow: hidden;
}

#main .mylistimage {
	margin:0px;
	padding-top:80px;;
    float: right;
    width: 172px;
    overflow: hidden;
}
#main .list .listtext {
    width: 100%;/*348px;  (176*2+16) - padding(20) */
}

/*
.PElist td, .PElist th,
.PEti td, .PEti th,
.PEform td, .PEform th,
.PEcal td, .PEcal th*/
/*
#main .text th, #main .text td {
    text-align: right;
}
*/



.block ul {
    margin: 1em 0;
    padding: 0;
    list-style: none;
    position: relative;
}
.block ul li {
    margin: 1em 0;
    padding: 0 0 0 10px;
    background: url(/chrome/circle.orange.png) 0px .55em no-repeat;
}
.block ul li h3 {
    margin: 0;
    font-weight: bold;
    font-size: 100%;
}
.block ul li p {
    margin: 0;
}
.date {
   /*  color: #EFAA10; */
}
#subcontent div.PElist ul li, #subcontent div.PEcal ul li {
    padding: 0;
    background: none;
}
div.PElist ul li h3 a, div.PEcal ul li h3 a {
    color: #306b61 !important;
}



#navigation ul {
    margin: 120px 0 0 0;
    padding: 0;
    list-style: none;
    /* border-top: 1px solid #C3C5C8; */
    border-top: 1px solid #F3C75B;
}
#navigation ul a {
    font-weight: normal;
    display: block;
    color: #306b61;
    margin: 0;
    padding: .4em 20px;
}
#navigation li {
    /* border-bottom: 1px solid #C3C5C8; */
    border-bottom: 1px solid #F3C75B;
}
#navigation ul a.selected {
    /* background-color: #f3c75b !important; */
    /* color: #fff !important; */
    color: #F3C75B !important;
}
#navigation ul ul a.selected {
    /* background-color: #f3c75b !important; 
    color: #f3c75b !important;
    background-color: transparent !important;
    */
    color: #F3C75B !important;
}
#navigation ul a:hover {
/*    background-color: #dce1e2; */ /*#c8d0d2;*/
    text-decoration: none;
}
#navigation ul ul a:hover {
    /* background-color: #eee; */
}
#navigation ul ul a.selected:hover {
    /* background-color: #eee !important; */
}
#navigation li a { padding-left: 10px; }
#navigation li li a { padding-left: 25px; }
#navigation li li li a { padding-left: 40px; }
#navigation li li li li a { padding-left: 55px; }
#navigation ul ul {
    margin: 0;
    border: none;
    /* background-color: #f7f8f8; */
}
#navigation li li {
    border: none;
}


#footer {
    padding-top: 4em;
    clear: both;
    font-size: 90%;
}



/** Search **/
#main .listing-pages {
    margin: 0;
    padding: 0;
    list-style: none;
    height: 3em;
}
#main .listing-pages li {
    display: block;
    margin: 0;
    padding: 0;
    background: #e8ebec;
    float: left;
    width: 1.5em;
    height: 1em;
    margin-right: 3px;
}
#main .listing-pages a {
    display: block;
    text-align: center;
    margin: 0;
    text-decoration: none;
    background: #e8ebec;
    border: 1px solid #ccc;
}
#main .listing-pages li.selected {
    background: none;
}
#main .listing-pages li.selected a {
    background: none;
}

#search .search-highlight {
    font-weight: bold;
}


#search-boxen{
   width: 955px;
   text-align:right;
}
#search-box {
    right: 20px;
    margin: 0;
    padding: 0;
    bottom: 15px;
    position: absolute;
}
#search-box input {
    margin: 0;
    padding: .1em 0 0 5px;
    width: 162px;
    color: #5f747a;
    float:right;
}



/**sitemap **/
#main #sitemap {
    width: 560px;
}
#sitemap ul {
    margin: 0;
    padding: 0;
}
#sitemap ul ul ul ul {
    margin-left: 20px;
}
#sitemap li {
    padding: 0;
    margin: .3em 0 2em 0;
    background: none;
}
#sitemap li li {
    margin: .2em 0;
}
#sitemap li a {
    display: block;
    padding: 0 0 .5em 0;
    margin-bottom: .5em;
    border-bottom: 1px solid #E16048;
    text-decoration: none;
    font-size: 110%;
    color: #44565c;
    font-weight: bold;
}
#sitemap li li a {
    border: none;
    color: #687a7f;
    padding: 0;
    margin: 0;
}
#sitemap li li li a {
    color: #504e53;
    padding-left: 13px;
    background: url(/chrome/circle.orange.png) 0 center no-repeat;
    font-weight: normal;
}
#sitemap li li li a:hover {
    background-image: url(/chrome/circle.orange.filled.png);
}
#sitemap li li li li a {
    background: none;
}
#sitemap li li li li a:hover {
    background: none;
}
#sitemap li a:hover {
    color: #E16048;
}




/** Width of PEs **/
#main .w3 {
    clear: both;
    width: 558px;
	padding: 5px;
    margin: 9px 0 9px 0;
	/* border: 1px solid #fff;*/
}
#main .w1 {
    float: left;
    width: 170px;
    margin-right: 9px; /* 16*/
    padding: 5px;
}
#main .w2 {
    float: left;
    width: 358px;
    margin-right: 9px; /* 16*/
    padding: 5px;
}
#main .w1 .text {
    width: 172px;
    float: none;
    margin-top: 1em;
}
#main .w1 .image {
    float: none;
    margin: 1em 0;
}
#main[id] .imageright.w2 .text,
#main[id] .imageleft.w2 .text {
    width: 172px;
}
#main .last {
    margin-right: 0;
}
#main .first {
    clear: both;
}
#main .PEseparator {
    width: 560px;
    clear: both;
    height: 1px;
    line-height: 1%;
}



/** Course listings **/
.courses-categories {
    margin: 1em 0;
    padding: 0;
    list-style: none;
    font-weight: bold;
    font-size: 110%;
}
.courses-categories a, .courses-categories a:hover, .courses-categories a:visited {
   color: #737373; 
}
.courses-categories li {
    margin: 1em 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    width: 560px;

    border: 1px solid black;
}
.courses-categories img {
    border: none;
    display: block;
}
.courses-categories span {
    display: block;
    position: absolute;
    top: 0;
    left: 20px;
    padding-top: .6em;
}
.courses-list {
    margin: 1em 0;
    padding: 0;
    list-style: none;
}
.courses-list li {
    margin: 1em 0;
    padding: 0;
}
#course-information h3 {
    margin-bottom: 0;
}
#course-information p {
    margin-top: 0;
}



.zebra-alternate, .alt {
    background-color: #e8ebec !important;
}

.PEborder {
    border: 1px solid #F3C75B;
    /*padding:10px; */
}
.PEnoborder {
    /* border: 1px solid #fff; */
}
/*
.print{
padding:10px;
}

#print{
margin:10px;
}
*/
#printcontent{
padding:10px;
}

.backgreen a strong {
 color: #f1f2f3;
  text-decoration: underline;
}


