﻿/*
    ETHOS web site CSS

*/

/* ===== initializing ===== */

body, div, h1, h2, h3, h4, hr, img {margin: 0;}

/* ===== global styles ===== */

.center     {text-align: center;}
.left       {text-align: left;}
.bold       {font-weight: bold;}
.ital       {font-style: italic;}
.uline      {text-decoration: underline;}
.indent     {margin-left: 2em;}
h1      {font-size: 1.65em; color: #1D476C; margin: 0 0 .25em 0;}
h2      {font-size: 1.15em; margin: 0 0 1em 0;}
h3      {font-size: 1em; margin: 0 0 1em 0;}
p       {font-size: 1em; margin: 0 0 1em 0;}

body {
    font-family: Arial, sans-serif;
    background: url(++resource++images/page_background.jpg);
    margin: 0;
    padding: 0;
}

#main {
    width: 80%;
    border: 2px solid #ccc;
    margin-left:10%;
    clear: none;

}

/* ===== masthead ===== */

#masthead {
    height: 100px;
    background: #fff url(++resource++images/masthead/masthead.png) no-repeat;
    background-position: right;
}

#logo {
    margin: 10px 0 0 10px;
    vertical-align: top;
    border: 0px;
}


/* ===== menu ===== */

#tabnavbar {
    border: 0;
    height: 1.5em;
    position: relative;
    z-index:0;
    background: #1D476C;
    text-align:right;
}

#tabnavbar a {
    font-weight: bold;
    padding: 0em 1em 0em 1em;
    line-height: 1.5em;
    border-left: 2px solid white;
    text-decoration: none; 
}

#tabnavbar a:first-child {
    border-left: 0px;
}
#tabnavbar a.active-menu-item {
    background: white;
    color: #1D476C;
}
#tabnavbar a.active-menu-item:hover {
    background: white;
}

#tabnavbar a.inactive-menu-item {
    background: #1D476C;
    color: white;
}

#tabnavbar a.inactive-menu-item:hover {
    background: white;
    color: #1D476C;
}



/* ===== middle ===== */

.titleLink{
    text-decoration:none;
    color:black;
    
}

.titleLink:hover{
    text-decoration:none;
    color:black;
    
}

#middle {

    background: #fff url(++resource++images/gradient_background.png) repeat-x;
    padding-bottom: 20px;
}

#sidebar {
    width: 230px;
    float:left;
}

#sidebar img {
    margin: 5px 10px 5px 20px;
}

#sidebar div.vertical-spacer {
    height:100px;
}

#sidebar p {
    margin-left:10px;
    font-size: .80em;
    font-style: italic;
    color: #474747;
    text-align: center;
    padding: 5px;
}

#sidebar h2 {
    margin-left:15px;
    font-size: 1.15em;
    font-weight: bold;
    color: #783D0F;
    text-align: center;
    padding: 5px;
}

#sidebar form {
    margin-top: 5px;
    margin-left: 5px;
    font-size: 11px;
    border: 1px solid #1D476C;
    text-align: center;
    padding: 5px;
    clear: left;
}

#sidebar a {
    width: 230px;
    font-weight: bolder;
    text-decoration: none;
    color: #474747;
    font-size: .85em;
    float:left;
    clear:left;
    margin-left:20px;
    margin-top:1em;
}

#sidebar a.active-menu-item {
    color: #783D0F;
}

#sidebar a:hover {
    color: #783D0F;
}

#content {
    margin-left:260px;
    margin-right:40px;
    padding-top:20px;
}

.lftcontent {
    width: 200px;
    float: left;
}

#midcontent {
    width: 250px;
    float: left;
}

#rgtcontent {
    width: 200px;
    float: left;
}

div.featureproduct{height:150px;}

.rgtcolcontent {
    padding-bottom: 15px;
    margin-left:205px;
}
    
div#spacer{
    clear:both;
    height:1px;
}

#content p {
    font-size: 1em;
    text-align: left;
}

#content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0 15px 0;
    vertical-align: top;
    border-style: none;
}

#content p img {
    margin-left: 0;
    margin-right: 30pt;
    padding: 0;
    float: left;
    vertical-align: bottom;
    border-style: none;
}

#content div.clientgroups {
    text-align: center;
    margin-right:300px;
}

#content div.clientgroups img{
    display: inline;
}

#content span.media_logos {
    text-align: center;
    display: block;
    clear:left;
}

#content span.media_logos a{
    margin-left:1em;
    margin-right:1em;
}

#content span.media_logos img{
    display: inline;
}

#content hr {
    height: 2px;
    margin: 20px 0 20px 0;
    background-color: #1D476C;
}

#content td {
    border: solid thin;
    text-align: center;
    vertical-align: top;
    margin: 5px;
}

#content ul li {
    text-align: left;
    font-size: .85em; 
    margin: 0 .25em 1em 0;
}

#content ul ul {  
    margin-top: 10px;  
}

#content ol li {
    margin-top: 5px;
    font-size: .80em;
    text-align: center;
    list-style: none;
}

#content ol li img {
    padding: 15px 0 0 0;
    vertical-align: bottom;
    border-style: none;
}

#content .imglicol {
    width: 450px;
}

#content .licol {
    width: 500px;
}

#content .plicol {
    width: 200px;
}

.ethoslist {

}

#address {margin-right:300px;}
#address p{text-align:center;}
#address h3{text-align:center;}

/* ===== footer ===== */

#footer {
    background: #ccc;
}

#footerleft {
    height: 80px;
    float: left;
    margin: 0;
    padding: 0;
    background: #ccc;
}

#footerleft ul{
    width:190px;
    margin:0 15px 0 10px;
    padding:0;
}

#footerleft ul li {
    font-weight: bolder;
    font-size: .70em;
    list-style: none;
    margin: 10px 0px 0px 35px;
    float: left;
    width: 50px;
}

#footerleft ul li a {
    color: #474747;
    text-decoration: none;
}

#footerright {
    height: 100%;
    margin-left:220px;
    background: #ccc;
    padding: 2% 2%;
}

#footerright img {
    margin: 0 15px;
    vertical-align: middle;
    border-style: none;
}

#footer hr {
    height: 10px;
    background-color: #1D476C;
}

#copyright {
    width: 100%;
    clear: both;
    background: #1D476C;
}

.legal {
    font-size: .70em;
    font-weight: bolder;
    color: white;
    text-align: center;
    margin: 0;
}

/* ===== misc ===== */

table.workshopusage{border:1px solid black; margin-left: 1em; float:left;}

div.mouseover{text-decoration: underline;
              color:black;
              width:9em;}

#content div#policy ol li {
    margin-top: 15px;
    margin-right: 15px;
    font-size: .80em;
    text-align: left;
    list-style: decimal;
}

.hidden{visibility:hidden;
        position:absolute;
        margin-top:-18em;
        margin-left:0px;
        width:40em;
        text-align:left;
        background: white;
        border:2px solid black;}
        
/*forms*/
div.row {margin-top:5px;}

/*div.row div.label {

    border: 1px solid black 
}*/

div.row div.widget {margin-left:5px;}


/*calendar*/

/*
* Calendar Views
*/

#calendar-navigation {
    display: block;
}

#calendar-navigation div a {
    text-decoration: none;
 }

#calendar-navigation-daily,
#calendar-navigation-weekly,
#calendar-navigation-monthly,
#calendar-navigation-yearly {
    display: inline;
    padding: 3px 4px;
    float: right;
    border-left: 1px solid #bab5ab;
}


#calendar-navigation-daily:hover,
#calendar-navigation-weekly:hover,
#calendar-navigation-monthly:hover,
#calendar-navigation-yearly:hover {
    background: #cfc9bc;
}

#calendar-navigation-context {
    background: #eae8e3;
    border: 1px #bab5ab solid;
    margin: 1ex auto;
    vertical-align: middle;
    overflow: auto;
    padding: 0px;
}

#calendar-navigation-context-previous,
#calendar-navigation-context-current,
#calendar-navigation-context-next {
    display: block;
    text-decoration: none;
    float: left;
    padding: 3px 4px;
    border-right: 1px solid #bab5ab;
}

#calendar-navigation-context-previous {
    text-align: left;
}

#calendar-navigation-context-previous SPAN {
    padding-left: 24px;
    background: url("++resource++previous.png") left center no-repeat;
}

#calendar-navigation-context-current {
    text-align: center;
}

#calendar-navigation-context-next {
    text-align: right;
}

#calendar-navigation-context-next SPAN {
    padding-right: 24px;
    background: url("++resource++next.png") right center no-repeat;
}

#calendar-navigation-context-previous:hover,
#calendar-navigation-context-current:hover,
#calendar-navigation-context-next:hover {
    background: #cfc9bc;
}

#calendar-view-year TD.month {
    padding: 1em;
}

#calendar-view-year TABLE.month,
#portlet-calendar-view-month TABLE.month,
#calendar-view-month {
    background: #eae8e3;
    border: 1px #4B6983 solid;
}

#calendar-view-month {
    width: 99%;
    min-width: 100%;
}

#calendar-view-year TABLE.month TH,
#portlet-calendar-view-month TABLE.month TH,
#calendar-view-month TH,
#calendar-view-month TD.weekno {
    background: #9DB8D2;
}

#calendar-view-month TD.weekno {
    border-right: 2px #4B6983 solid;
    border-bottom: 1px #4b6983 solid;
    font-family: cursive, serif;
    font-size: x-large;
    font-style: italic;
}

#calendar-view-year TABLE.month TH.month-weekday,
#calendar-view-month TH.weekday {
    font-weight: normal;
    padding: 2px;
    border-bottom: 1px #4B6983 solid;
}

.cal_yearly_day_busy {
    background: #9DB8D2;
    color: #9C0000;
}

#calendar-view-year TABLE.month TH.month-title A {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: #f0f0f0;
    background: #4B6983;
    padding-top: 3px;
    padding-bottom: 1px;
}

#calendar-view-year TABLE.month TH.month-title A:hover {
    background: #314e6c;
}

#calendar-view-year TABLE.month TH {
}

#calendar-view-year TABLE.month TD {
}

#calendar-view-year TABLE.month TD A,
#calendar-view-month TD A  {
    text-decoration: none;
    display: block;
    padding: 1px;
}

#portlet-calendar-view-month TABLE.month TD A {
    text-decoration: none;
    display: block;
    font-weight: normal;
    padding: 1px;
}

#calendar-view-month TH.month-title {
    color: #f0f0f0;
    background: #4B6983;
}

#calendar-view-year TABLE.month TD A:hover,
#calendar-view-month TD A:hover,
#portlet-calendar-view-month TABLE.month TD A:hover,
#calendar-view-week TH A:hover {
    color: #f0f0f0;
    background: #314e6c;
}

#calendar-view-month TD.weekno {
}

#calendar-view-month TD.day,
#portlet-calendar-view-month TABLE.month TD {
    border-right: 1px #bab5ab solid;
    border-bottom: 1px #bab5ab solid;
}

#calendar-view-month TD.day A,
#calendar-view-month TD.day-other A,
#calendar-view-month TD.weekno A {
    margin: auto;
    display: block;
    height: 100%;
    min-height: 80px;
}

#calendar-view-month TD.weekno A {
    height: 100%;
    width: 100%;
    color: #7590AE;
    padding-left: 0.5ex;
    padding-right: 0.5ex;
}

#calendar-view-month TD.day-other {
    background: #bab5ab;
}

#calendar-view-month TD.day-other A {
    color: #807d74;
}

#calendar-view-month .event,
#calendar-view-month .comp_event {
    font-weight: normal;
    font-size: xx-small;
    display: block;
    padding: 1px;
    border: 1px #eae8e3 solid;
}

#calendar-view-month A:hover .event,
#calendar-view-month A:hover .comp_event {
    color: #000;
    border: 1px #314e6c solid;
}

#calendar-view-month .event {
    background: #9db8d2;
}

#calendar-view-month .comp_event {
    background: #e0b6af;
}

#calendar-view-week {
    border-top: 2px #4B6983 solid;
}

#calendar-view-week TD {
    width: 20em;
    background: #eae8e3;
    font-size: smaller;
}
#calendar-view-week TH {
    border-right: 1px #4B6983 solid;
}

#calendar-view-week TH.first {
    border-left: 1px #4B6983 solid;
}

#calendar-view-week TH.day-title {
    background: #9DB8D2;
    border-bottom: 1px #4B6983 solid;
}

#calendar-view-week TH A {
    display: block;
    width: 100%;
    text-align: center;
    text-decoration: none;
}

#calendar-view-week TD {
    border-right: 1px #bab5ab solid;
    border-bottom: 2px #bab5ab solid;
}

#calendar-view-week TD.first {
    border-left: 2px #bab5ab solid;
}

#calendar-view-week TD A {
    display: block;
    border: 1px solid;
    margin: 2px;
    padding: 0.5em;
    text-decoration: none;
    font-weight: normal;
}

#calendar-view-week TD A .time {
    font-size: smaller;
}

#calendar-view-week TD A.first {
}

#calendar-view-week TD A:hover {
    color: #f0f0f0;
    background: #314e6c;
}

/* Day View
* The height attribute is defined inline depending on the length of the visible
* day
*/
#calendar-view-day {
    border: #aaaaaa 1px solid;
    border-top: none;
    position: relative;
    padding-top: 2px;
}

#events-allday {
    margin-bottom: 1px;
}

#events-allday .event-allday {
    position: relative;
    margin-top: 1px;
}

#events-allday .event-allday H6 {
    margin: 0;
    font-size: small;
    text-align: center;
}
#events-allday .event-allday H6 A {
    text-decoration: none;
    display: block;
}

#events-allday .event-allday A.delete {
    position: absolute;
    top: 0px;
    right: 2px;
    display: block;
    text-decoration: none;
    overflow: hidden;
    border: 0;
    padding: 0;
    cursor: pointer;
}

#events-allday .event-allday P {
    font-size: smaller;
    margin: 0 1em;
    text-align: center;
}



#calendar-view-day .hour {
    border-top: 1px #bab5ab solid;
    width: 100%;
    position: absolute;
    height: 4em;
    margin: 0 !important;
    padding: 0 !important;
}

#calendar-view-day .even {
    background: #eae8e3;
}

#calendar-view-day .active {
    background: #a8a5a0;
}

#calendar-view-day .hour .title {
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    margin-left: 0.5em;
}

#calendar-view-day .events {
    position: absolute;
    margin-left: 5.5em;
    left: 0;
    top: 0;
    width: 100%;
}

#calendar-view-day .event {
    position: absolute;
    margin-left: 5em;
    width: 20em;
    min-width: 20em;
    border: 1px #4b6983 solid;
    background: #9db8d2;
    opacity: 0.85;
}

#calendar-view-day .expanded {
        overflow: visible;
        display: block;
    opacity: 1;
    z-index: 9;
    height: auto !important;
}

#calendar-view-day .contracted {
        z-index: 1;
        overflow: hidden;
        display: block;
}

a.bdgdelete {
height: 5px;
width:10px;

}
a.bdgdelete img{
margin-top:-5px;
width:12px;
}

#calendar-view-day .other {
    background: #e0b6af;
    border: 1px #884631 solid;
}

#calendar-view-day .event H6 {
    font-size: small;
    margin: 0;
    padding: 2px;
    background: #7590ae;
    font-weight: bold;
    line-height: 1em;
    opacity: 1 !important;
}

#calendar-view-day .other H6 {
    background: #c1665a;
}

#calendar-view-day .event H6 A {
    color: #fff;
    text-decoration: none;
    display: block;
}

#calendar-view-day .event H6 .start-end {
    font-weight: bold;
    color: #000;
}

#calendar-view-day .event A.delete {
    position: absolute;
    top: 1px;
    right: 1px;
    display: block;
    text-decoration: none;
    overflow: hidden;
    border: 0;
    padding: 0;
    cursor: pointer;
}

#calendar-view-day .event .body {
    margin: 0.5ex;
    padding: 0.5ex;
}

#calendar-view-day .event .booked-resources {
    border: 1px;
    padding: 0.5ex;
    font-size: 80%;
}

#calendar-view-day .event .booked-resources-header A {
    color: #000;
    text-decoration: none;
    display: block;
}

#calendar-view-day .event .booked-resources a {
    display: block;
}

#calendar-view-day .event .body .title {
    font-style: italic;
}

#calendar-view-day .hour A.event-new {
    padding: 0.5ex;
    cursor: pointer;
    text-decoration: none;
}

#calendar-view-day .hour SPAN.event-new {
    font-weight: bold;
    padding: 0.5ex;
}

/*
* Content specific styling
*/

body#path-login H1 {
    display: none;
}

body#path-login #column-center {
    margin-left: 0;
}

body#path-login FORM.standalone {
    vertical-align: middle;
    margin-top: 10%;
    margin-bottom: 10%;
}

#portlet-navigation-calendar {
    padding-left: 3em !important;
    background: url("/calendar.png") left no-repeat;
}

#portlet-navigation-calendar:hover {
    padding-left: 3em !important;
    background: #748fad url("/calendar.png") left no-repeat !important;
}

#portlet-navigation-information {
    padding-left: 3em !important;
    background: url("/information.png") left no-repeat;
}

#portlet-navigation-information:hover {
    padding-left: 3em !important;
    background: #748fad url(".png") left no-repeat !important;
}

#portlet-calendar-view-month {
    text-align: center;
}

#portlet-calendar-view-month TABLE.month {
    margin: 0.5em auto;
}

#portlet-jumpto FORM {
    border-bottom: 1px #aaa dashed;
    padding: 0.5em;
    font-size: smaller;
    margin: auto;
}

#portlet-calendar-overlay FORM {
    margin: 2px;
}
#portlet-calendar-overlay INPUT {
    margin-left: 0.5em;
}

#portlet-calendar-overlay LABEL {
    display: block;
}

#portlet-calendar-overlay LABEL:hover {
    color: #888888;
}

#portlet-calendar-overlay LABEL.disabled {
    color: #888888;
}

#portlet-calendar-overlay A.go {
    float: right;
    top: -1.25em;
    margin-right: 0.25em;
    width: 1em;
    height: 1em;
    position: relative;
    text-decoration: none;
}
#portlet-calendar-overlay A.go IMG {
    border: none;
}

.CalendarFrame {
    border: 2px solid #c0c0c0;
    border-collapse: collapse;
}

.DateControlFrame {
    text-align: center;
    padding: 3px;
    border: 2px solid #c0c0c0;
}

.DateControls {
    font-size: xx-small;
}

.CalHeader {
    font-family: Arial, Helvetica;
    font-size: small;
    font-weight: bold;
    width: 20px;
    text-align: center;
    border-top: 1px solid #c0c0c0;
}

.CellElement {
    font-family: Arial, Helvetica;
    font-size: small;
    text-align: center;
    cursor: pointer;
    cursor: hand;
    border: 1px solid #c0c0c0;
    padding: 2px;
}

.CurrentCellElement {
    font-family: Arial, Helvetica;
    font-size: small;
    background: #CCCC99;
    color: #000;
    text-align: center;
    cursor: pointer;
    cursor: hand;
    border: 1px solid #c0c0c0;
    padding: 2px;
}

.EmptyCell {
    background: #eee;
    font-family: Arial, Helvetica;
    font-size: x-small;
    padding: 2px;
    border: 1px solid #c0c0c0;
}

.CloseControls {
    font-family: Arial, Helvetica;
    font-size: x-small;
    text-align: center;
    border-top: 1px solid #c0c0c0;
    padding-top: 3px;
    padding-bottom: 3px;
}

.close {
    cursor: pointer;
    cursor: hand;
    color: #993333;
}

.cancel {
    cursor: pointer;
    cursor: hand;
    color: #336699;
}

.today {
    cursor: pointer;
    cursor: hand;
    color: #336699;
}

/* Date Widget Textbox */

.DateField {
    font-family: Arial, Helvetica;
    font-size: x-small;
    border: 1px solid;
    background: #fff;
    padding: 1px;
    text-align: center;
}

/*  Popup Icon */

.CalIcon {
    vertical-align:middle;
    cursor: pointer;
    cursor: hand;
    height:18px;
    width: 18px;
}

.legend-title{
  text-align: center;
  margin-top: 1ex;
  text-decoration: underline;
  font-weight: bold;
}

.legend-item{

}

/* Calendar Styles */

div.field textarea {width:180px; height:180px;}

/* Twitter Viewlet */

div#twitter {
    float:right;
    padding:40px;
}
