@charset "utf-8"; /* CSS Document */ /*colors text #626EE8 a #555599 note #666 #f0f0f0 feedback #f0f0ff warning #fff0f0 flash 0, #ffcc65 inputs top, left #c3c9ff btm, right #e9ecff list item.odd #fcfcff item:hover #c3c9ff box header #c2c8ff subheader #edefff body #fcfcff hover #edefff */ /* tags */ xdiv { padding: 2px; margin: 2px; border: 1px dashed red; } * { margin:0; padding: 0; border: 0;} body, input, textarea, select { font: 12px/18px Tahoma, "Myriad Pro", Arial, Helvetica, sans-serif; color: #626EE8; color: black; background: white;} body { text-align: center; margin: 5px 0 20px 0; } a { color: #555599; /*color: #1E28BE;*/ text-decoration: none; } a:hover { text-decoration: underline; } h1, h2, h3, h4, h5 { font-weight: normal; color: #626EE8;} h1, #headerTitle h1 { font-size: 30px; color: #626EE8;} h2 { font-size: 23px; } h3 { font-size: 20px; } h4 { font-size: 12px; } p { margin: 0 0 12px 0; } table { width: 100%; border-collapse: collapse; } form input, form select, form textarea { padding: 3px; width: 95%; background: white; color: #333; border-top: 1px #c3c9ff solid; border-left: 1px #c3c9ff solid; border-bottom: 1px #e9ecff solid; border-right: 1px #e9ecff solid; } form input.checkbox { width: 1em; height: 1em} form select { padding: 2px; } form textarea { height: 50px; overflow: auto; } /* forms */ form {} form .formRow { margin: 0 0 3px 0; line-height: 20px; } /* form .formRow.short { margin: 0 50% 2px 0; }*/ form .formLabel { float: left; width: 70px; text-align: right; clear: left; padding: 4px 0 0 0;} form .formControl .text { padding: 4px 0 0 0; } form .formControl { margin: 0 0 0 80px; } form input.submit { border-bottom: 1px #c3c9ff solid; border-right: 1px #c3c9ff solid; border-top: 1px #e9ecff solid; border-left: 1px #e9ecff solid; width: auto; padding: 1px;} form input.day { width: 2em; } form select.month { width: 8em; } form input.year { width: 3em; } form .error { border: 1px solid #ff9845; background-color: #FFE9BF; color: #000000;} /* buttons */ .button { border: 0; padding: 0; margin: 0; height: 22px; width: 70px; cursor: pointer; background: url(../images/button_sprites.gif) top left no-repeat;} a.button { display: block; float: left; margin: 0 0.5em 0 0; background-repeat: no-repeat; } .buttonLogin { background-position: 0px -22px; } .buttonUpdate { width:86px; background-position: 0px -44px; } .buttonNext { width:66px; background-position: 0px -66px; } .buttonSend { width:69px; background-position: 0px -88px; } .buttonSkip { width:65px; background-position: 0px -110px; } .buttonLogout { width:83px; background-position: 0px -132px; } .buttonChange { width:88px; background-position: 0px -154px; } .buttonInvite { width: 76px; background-position: 0px -176px; } .buttonInviteHere { width: 126px; background-position: 0px -198px; } .buttonAccept { width:83px; background-position: 0px -220px; } .buttonNewGroup { width: 127px; background-position: 0px -242px; } .buttonRegister { width:91px; background-position: 0px -264px; } .buttonRemember { width:123px; background-position: 0px -286px; } .buttonDelete { width: 81px; background-position: 0px -308px; } .buttonRefuse { width: 81px; background-position: 0px -330px; } /* #layout */ #layout { width: 90%; min-width: 650px; max-width: 1000px; text-align: left; margin: 0 auto;} #header { height: 140px; background: url(../images/header_bg.gif) top repeat-x; overflow: hidden; } #headerLeft { padding-left: 15px; width: 185px; height: 140px; background: url(../images/header_l.gif) left top no-repeat; float: left; } #headerRight { width: 15px; float: right; height: 140px; background: url(../images/header_r.gif) right top no-repeat; } a#headerLogo { position: relative; display: block; width:185px; height: 140px; font-size: 40px; color: #c3c9ff; } a#headerLogo span { position: absolute; top:0; left:0; width: 185px; height: 140px; background: url(../images/header_logo.gif) no-repeat; } #headerCenter { height: 140px; margin: 0 15px 0 220px; } #headerLogin { height: 45px; text-align: right; } #headerMenu { height: 30px; text-align: right; } #headerTitle { } #headerTitle.loading { background: url(../images/loading.gif) right bottom no-repeat; } #footer { height: 130px; background: url(../images/footer_bg.gif) bottom repeat-x; color: #626EE8;} #footerLeft { width: 15px; height: 130px; background: url(../images/footer_l.gif) left top no-repeat; float: left; } #footerRight { width: 15px; float: right; height: 130px; background: url(../images/footer_r.gif) right top no-repeat; } #footerCenter { margin: 0 15px 0 15px; } #footerBody { padding-top: 100px; background: url(../images/footer_logo.jpg) right bottom no-repeat;} /* #layout #middle */ #layout #middle { background: url(../images/middle_bg.gif) right repeat-y; } #layout #middleWrap { background: url(../images/middle_bg.gif) left repeat-y; } #sideBar { float: right; width: 30%; } #contentBar { margin-right: 30%; } #sideBody { margin: 0 10px 0 5px; } #contentBody { margin: 0 5px 0px 10px; padding: 0 0 10px 0; zoom: 1;} /* #layout #headerLogin */ #headerLogin { text-align: right; } #headerLogin ul { list-style-type: none; float: right; } #headerLogin ul li { float: left; display: inline; margin-left: 5px;} #headerLogin ul.login li.input{ width: 100px; padding: 0 2px;} #headerLogin ul.login li.input input { padding: 2px; } #headerLogin ul.login li.buttonWrap{ width: 85px; } #headerLogin ul.login div { display: block; font-size: 11px; text-align: left; white-space: nowrap; line-height: 14px; height: 14px;} #headerLogin .logout { margin: 16px 0 0 0;} /* .note */ .note { margin-bottom: 10px; background: #f0f0ff; color: #555;} #sideBar .note { color: #626EE8; } .note ul li { margin-left: 1em; } .note.nobr { margin: 0; } .noteHeader { height: 5px; background: url(../images/box_tr.gif) right no-repeat; } .noteHeader div { height: 5px; width: 5px; background: url(../images/box_tl.gif) left no-repeat; } .noteInner { padding: 0 10px; text-align: left;} .noteInner h3 { margin: 5px 0 10px 0; } .noteInner.nobr h3 { margin: 0 0 5px 0; } .noteFooter { height: 5px; background: url(../images/box_br.gif) right no-repeat; } .noteFooter div { height: 5px; width: 5px; background: url(../images/box_bl.gif) left no-repeat; } .note.feedback { background: #f0f0ff; } .note.warning { background: #fff0f0; } .note.flash { background: #ffcc65;} .note.flash .flashAttention { background: url(../images/icons/iconAttention.gif) left top no-repeat; } .note.flash .flashIcon { background: url(../images/icon_flash.gif) left top no-repeat; } .note.flash .noteBody { margin: 10px 10px 0px 27px; padding: 0 0 10px 0; color: #333; overflow: hidden; word-wrap: break-word;} /* noteHead noteList */ .note .noteBody .noteHead { float: left; width: 140px; text-align: right; } .note .noteBody .noteList { margin: 0 0 0 160px; zoom: 1; } /* calendar */ .note.calendar { background-color: #c2c8ff; } .note.calendar .noteInner { background-color: #fafaff; } .note.calendar .noteFooter { background-color: #fafaff; } .note.calendar .calendarYear h3, .note.calendar .calendarYear h3 a { color: #555599; margin: 0 0 2px 0; } .note.calendar .calendarYear { text-align: center; } .note.calendar table.calendarMonths { } .note.calendar table.calendarMonths td { text-align: center; } .note.calendar table.calendarMonths td a { display: block; line-height: 28px; } .note.calendar table.calendarMonths td a:hover{ background: #e2e8ff;} .note.calendar table.calendarMonths td a.currentMonth { background: #e2e8ff; font-weight: bold; } .note.calendar table.calendarMonths td a.hasEvent { font-weight: bold; } .note.calendar table.calendarDays { background: #fafaff; } .note.calendar table.calendarDays thead { background: #e2e8ff; } .note.calendar table.calendarDays thead td a{ display: block; font-weight: bold; } .note.calendar table.calendarDays thead .weekend { color: #900506 } .note.calendar table.calendarDays td { text-align: center; padding: 2px 0; } /* calendar events */ .note table.calendarDays, .note table.calendarDays a { color: #000; } .note table.calendarDays span { width: 18px; display: block; text-align: right; } .note table.calendarDays td { width: 14%; } .note table.calendarDays a { display: block; line-height: 24px; border: 2px solid #fafaff;} .note table.calendarDays a:hover { background: white; border-color: white; } .note table.calendarDays a.event {background: #ff9845; border-color: #ff9845; color: white; font-weight: bold; } .note table.calendarDays a.event:hover {background: #ffa761; border-color: #ffa761;} .note table.calendarDays a.today { border-color: #555599;} .note table.calendarDays a.holiday { color: #900506 } .note table.calendarDays a.today:hover { border-color: #555599;} .note table.calendarDays a.editing { border: 2px solid #900506; background-color: #d54e4e; color: white; font-weight: bold; } .note table.calendarDays .editing a, .note table.calendarDays .event a { color: white; } /* upcoming events */ .note.events { background-color: #f5f5ff; } .note.events .noteInner { padding: 0 10px 5px 10px; } .note.events table { table-layout: fixed; } .note.events table.upcomingEvents td { } .note.events table.upcomingEvents td.date { padding: 5px 5px 5px 10px; font-weight: bold; width: 50px; color: #555599; width: 5em;} .note.events table.upcomingEvents td.title { padding: 5px 10px 5px 0px; } .note.events table.upcomingEvents td.title div { overflow:hidden; } .note.events table.upcomingEvents *.odd { background: #ecf3fe; } .note.events table.upcomingEvents thead { display: none; } .note.events table.upcomingEvents thead td { margin: 0; padding: 0; height: 1px;} /* .box */ .box { margin-bottom: 10px; /*background: #fcfcff;*/} .box .boxHeader { background: #c2c8ff url(../images/box_tr.gif) top right no-repeat; zoom: 1; position: relative; } .box .boxHeader .boxLeft { background: url(../images/box_tl.gif) top right no-repeat; width: 5px; height: 40px; float: left; } .box .boxHeading { margin: 0px 0 0 50px; padding: 2px 0 2px 0px;vertical-align: middle; } .box .boxHeading h2, .box .boxHeading a, .box .boxHeading input {font-size: 20px; color: #fff;vertical-align: middle; } .box .boxHeading h2 { display: block; line-height: 34px;} .box .boxHeading .head { } .box .boxHeading div.input { margin: 0 105px 0 0; } .box .boxHeading div.input div { } .box .boxHeading div.input input { color: #555599; width: 95%;} .box div.okbutton { float:right; width: 70px; margin: 0; padding: 0; } .box .boxHeading div.okbutton { float:right; width: 92px; } .box div.okbutton div { } .box div.okbutton input.button { } .box .boxSubheader { background: #f2f2ff; padding: 3px 0 5px 50px; zoom: 1; color: #333;} .box .boxInner { padding: 10px 20px; } .box .boxFooter { height: 12px; background: #edefff url(../images/box_footer.gif) bottom right no-repeat; margin: 10px 0 0 0;} .box .boxFooter div { height: 12px; width: 12px; background: #edefff url(../images/box_footer.gif) bottom left no-repeat; } /* .box .boxNonpublic */ .box.boxNonpublic .boxHeader { background-color: #ff9845; } .box.boxNonpublic .boxSubheader, .box.boxNonpublic .boxFooter, .box.boxNonpublic .boxFooter div { background-color: #ffe9bf; } /* .box .boxMyGroup */ .box.boxMyGroup .boxHeader { background-color: #5765e2;} .box.boxMyGroup .boxSubheader, .box.boxMyGroup .boxFooter, .box.boxMyGroup .boxFooter div {background-color: #d2d6f7; } /* .box .boxFooter div div { height: 12px; width: 12px; background: #c2c8ff url(../images/box_footer_l.gif) bottom left no-repeat; }*/ /* icons */ .box .boxHeader .boxIcon { width: 40px; height: 40px; position: absolute; top: 10px; left: 5px; background: url(../images/icon_default.png) center center no-repeat; behavior: url('/javascripts/iepngfix.htc'); } .box .boxHeader .boxIcon.boxIconNonpublic { background: url(../images/icon_nonpublic.png) center center no-repeat; behavior: url('/javascripts/iepngfix.htc'); } .box .boxHeader .boxIcon.warning { background-image: url(../images/icon_warning.gif); } /* list */ .boxList {} .boxList .boxInner { padding: 5px 0 0 0; } .boxList .listItem { padding: 8px 0 8px 0; zoom:1; color: #000; } .boxList .listItem.even, .boxList .listItem.buttons.even, .boxList .listItem.buttons.even:hover { background: #ecf3fe; } .boxList .listItem.selected, .boxList .listItem:hover, .listItem.hover { border-left: 0; border-right: 0; background: #e2e8ff /*#ffffff; /* background: border: 1px dotted #c3c9ff;*/} /* icons show/hide */ .boxList .listItem .icons { visibility: hidden; } .boxList .listItem.nohover .icons { visibility: visible; } .boxList .listItem:hover .icons, .list .listItem.hover .icons { visibility: visible; } .boxList .listItem.buttons, .boxList .listItem.buttons:hover { background: #ffffff; }*/ .boxList .listItem.nohover .icons { visibility: visible; } /* list item */ .boxList .listItem .itemBody { margin: 0 22px 0 50px; zoom: 1;} /* listWishes */ .listWishes .listItem .itemBody div { overflow: hidden; word-wrap: break-word; padding: 2px;} /* listContacts */ .listContacts .listItem.thinking { background: #ffdcd3; } .listContacts .listItem .itemBody .friendName { margin-right: 50%; word-wrap: break-word; } .listContacts .listItem .itemBody .friendName div { overflow: hidden; } .listContacts .listItem .itemBody .friendEmail { float: right; width: 50%; overflow: hidden; word-wrap: break-word;} .listContacts .listItem .itemBody .friendEmail div { float: left; margin-left: 10px; overflow: hidden; } .listContacts .listItem .itemBody .friendEmail .iconResend { display: block; float: left; height: 16px; width: 16px; background: url(../images/icon_sprites.gif) left top no-repeat; margin-left: 5px; background-position: 0 -300px; } .listContacts .listItem .itemBody .friendEmail .iconRefused { display: block; float: left; height: 16px; width: 16px; background: url(../images/icon_sprites.gif) left top no-repeat; margin-left: 5px; background-position: 0 -350px; } /* .box .iconLink */ .box .iconLink { height: 20px; padding: 2px 0 0 0;} .box .iconLink .icon { float: left; width: 16px; height: 16px; display: block; background: url(../images/icon_sprites.gif); margin: 0 5px 0 0;} .box .iconLink .iconAdd { background-position: 0 -200px; } /* .box .icon */ .box a.icon span { display: none; } .box a.icon { display: block; float: left; height: 16px; width: 16px; background: url(../images/icon_sprites.gif) left top no-repeat; margin: 2px 5px 0 0;} .box a.icon.iconDrop { background-position: 0 -50px ; } /* .boxList .listItem .icons */ .boxList .listItem .icons a span { display: none; } .boxList .listItem .icons { margin: 0 2px; padding: 2px 0 0 0; } .boxList .listItem .iconsDefault { float: left; width: 43px; display: inline; } .boxList .listItem .iconsExtra { float: right; width: 20px; display: inline; } .boxList .listItem .icons * { display: block; float: left; height: 16px; width: 16px; background: url(../images/icon_sprites.gif) left top no-repeat; margin: 0 1px 0 2px; border: 0;} /* boxList listItem controls */ .boxList .listItem .controls { margin: 0 0 0 23px; float: left; display: inline; } /* list item icons */ .boxList .listItem .icons .iconDrop { background-position: 0 -50px ; } .boxList .listItem .icons .iconEdit { background-position: 0 -150px; } .boxList .listItem .icons .iconDrag { background-position: 0 -100px; cursor: move;} .boxList .listItem .icons .iconOk { background-position: 0 -398px;height: 18px; cursor: pointer;} .boxList .listItem .icons .iconAdd { background-position: 0 -198px; height: 18px;} .boxList .listItem .iconReserved {line-height: 18px; background: url(../images/icon_sprites.gif) 0 -251px no-repeat; width:12px; padding: 6px; } /* .note .noteInner help text */ .note .noteInner .button { display: normal; cursor: default; vertical-align: middle; } img.icon { width: 16px; vertical-align: -3px; background: url(../images/icon_sprites.gif);} img.icon.iconDrop { background-position: 0 -50px ; } img.icon.iconEdit { background-position: 0 -150px; } img.icon.iconDrag { background-position: 0 -100px; cursor: move;} img.icon.iconOk { background-position: 0 -398px; height: 18px; cursor: pointer;} img.icon.iconAdd { background-position: 0 -198px; height: 18px;} img.icon.iconReserved { background: url(../images/icon_sprites.gif) 0 -250px no-repeat; height: 16px; width:12px; padding: 6px; } /* itemEvent */ .itemEvent .eventHead { margin: -5px 0 0 0; overflow: hidden; } .itemEvent .eventDate { float: left; text-align: center; width: 30px; height: 45px; background: url(../images/eventdate.gif) no-repeat; color: #333; } .itemEvent .eventDate a { color: #333; text-decoration: none; display: block;} .itemEvent .eventDate.old a { color: #999; } .itemEvent .eventDate.holiday a { color: #900506; } .itemEvent .eventDate.today h3 a { text-decoration: underline; } .itemEvent .eventTitle { font-size: 20px; word-wrap: break-word; overflow: hidden; zoom: 1;} .itemEvent .eventTitleEdit { margin: 0 80px 0 2px; } .itemEvent .eventTitleEdit input { font-size: 20px; width: 90%; } .itemEvent .eventContent { margin: 0 0 0 35px; } .itemEvent .eventProperties { overflow: hidden; } /* .itemEvent .eventProperties */ /* .itemEvent .eventProperties .formRow .formLabel { width: 65px; } .itemEvent .eventProperties .formRow .formControl { margin: 0 0 0 70px;}*/ .itemEvent .eventProperties .formRow { } .itemEvent .eventProperties .formRow .controlGroup { display: inline; white-space: nowrap; } .itemEvent .eventProperties .formRow .controlGroup * { margin: 0 0 3px 0;} /* itemEvents controls */ form select.repeat1 { width: 6em; } form select.repeat2 { width: 7em; } form *.short { width: 25em; } /* buttons at index*/ .welcomeBg { background:url(../images/bb_bg.jpg) repeat-x; text-align: left; height: 100px; margin-bottom: 15px; position: relative;} .welcomeLeft { background:url(../images/bb_l.jpg) left top no-repeat; height: 100px; padding: 0 0 0 15px; } .welcomeRight { background:url(../images/bb_r.jpg) right top no-repeat; height: 100px; } .welcomeIcon { position: absolute; left: -100px; top:0; margin: 0; } .welcomeIcon a { display: block; background:url(../images/bb_c.jpg); height:100px; width:95px; } .welcomeBody { position: relative; margin: 0 0 0 95px; } .welcomeBody .image { height:52px; } .welcomeBody .image a { background: url(../images/bb_t.jpg) no-repeat; display: block; height:52px; width: 280px; } .welcomeBody .text { margin: 5px 0 0 5px; color: #ffffff; font-size: 18px;} .welcomeBody .text a { color: #ffffff; } /* green button */ .welcomeBtn { cursor: pointer; } .welcomeBtn3 .welcomeBg { background-image: url(../images/gb_bg.jpg); } .welcomeBtn3 .welcomeLeft {background-image: url(../images/gb_l.jpg); } .welcomeBtn3 .welcomeRight {background-image: url(../images/gb_r.jpg); } .welcomeBtn3 .welcomeIcon a { background-image:url(../images/gb_c.jpg); } .welcomeBtn3 .welcomeBody .image a {background-image: url(../images/gb_t.jpg); } /* orange button */ .welcomeBtn2 .welcomeBg { background-image: url(../images/ob_bg.jpg); } .welcomeBtn2 .welcomeLeft {background-image: url(../images/ob_l.jpg); } .welcomeBtn2 .welcomeRight {background-image: url(../images/ob_r.jpg); } .welcomeBtn2 .welcomeIcon a { background-image:url(../images/ob_c.jpg); } .welcomeBtn2 .welcomeBody .image a {background-image: url(../images/ob_t.jpg); } /* service */ .clrflt { clear: both; } .xformRow, .xformRow div { padding: 5px; border: 1px solid black; }