* { margin: 0px; padding: 0px; font-family: verdana; font-weight: normal; font-size: 11px; color: #000; color: #006; }
body { background-color: #fff; }
input, select, textarea { padding: 6px; border: 1px solid #ccccce; border-radius: 3px; border-top-left-radius: 0px; }
label, legend { float: left; width: 100%; margin-top: 15px; margin-bottom: 5px; text-transform: uppercase; font-family: 'Open Sans', sans-serif; }
a { text-decoration: none; }
strong { font-weight: bold; }
li { list-style-type: none; }
h1, h2 { text-transform: uppercase; font-family: 'Open Sans', sans-serif; }
h1 { color: #666; }
h3 {}
h4 {}
h5 {}
h6 {}
.button { text-transform: uppercase; font-weight: 600; font-family: 'Open Sans', sans-serif; color: #446; cursor: pointer; border: 0px; padding: 0px; background-color: transparent; }
.button:hover { color: #1176ff; }
.button2 { font-size: 10px; text-transform: uppercase; padding-top: 5px; padding-bottom: 5px; border: 1px solid #fff; border-radius: 3px; text-align: center; cursor: pointer; }
.button2:hover { background-color: #dddddf; }
.left { float: left; }
.right { float: right; }
.line { float: left; width: 100%; }
.error-message { font-size: 10px; color: #f00; text-transform: uppercase; }
.page { float: left; margin-left: 20px; padding-bottom: 20px; width: 665px; border-right: 1px dotted #ddd; }
.page-notification { float: left; margin: 10px; color: #666; font-weight: 600; font-family: 'Open Sans', sans-serif; text-transform: uppercase; }
.extended-input-normal { color: #888; }
.extended-input-active { color: #006; }
.hidden { display: none; }
.stop-scrolling { height: 100%; overflow: hidden; }
.loader { float: left; margin-left: 20px; margin-top: 10px; }
.active { color: #a00; }
.center-align { text-align: center; }
ul.context-menu { position: absolute; display: none; z-index: 20; float: left; margin: 0px; padding: 5px 0px 5px 0px; background-color: #eeeef0; border: 1px solid #dddddf; border-bottom: 1px solid #d8d8d8; border-radius: 3px; box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.15); }
ul.context-menu li { float: left; width: 100%; }
ul.context-menu li a { float: left; padding: 3px 3px 3px 10px; font-size: 10px; }
ul.button-list { float: right; margin-top: 10px; }
ul.button-list li { float: left; margin-left: 10px; }
ul.button-list li a { float: left; }

/* header */
header
{
    float: left; width: 100%; height: 85px; margin-bottom: 10px; box-shadow: 0px -1px 5px 5px rgba(0, 0, 0, 0.11); border-bottom: 1px solid #fff;
    background-color: #f2f2f4;
}
header .logo { float: left; margin-left: 5px; width: 178px; height: 80px; background-image: url(DefaultImages/logo.png); }
header .navigation { float: left; margin-top: 50px; }
header .navigation nav { float: left; width: 100%; }
header .navigation nav a { float: left; margin-left: 20px; }

/* Hint */
.hint { position: absolute; z-index: 99; }
.hint span { float: left; width: 100%; background-color: #000; border-radius: 3px; padding: 3px 5px 3px 5px; color: #fff; font-size: 10px }
.hint img { float: left; margin-left: 8px; }

/* start view */
.start-view { width: 1000px; margin: 0px auto 0px auto; }
.start-view .left { width: 300px; margin-top: 40px; margin-bottom: 20px; }
.start-view .left ul { float: left; width: 100%; border-right: 1px solid #eee; padding-right: 20px; }
.start-view .left ul li { float: left; width: 300px; margin-right: 20px; margin-bottom: 40px; }
.start-view .left ul li h1 { color: #b00; font-size: 12px; margin-bottom: 5px; }
.start-view .left ul li p { line-height: 18px; color: #666; }
.start-view .right{ width: 652px; margin-top: 40px; margin-bottom: 20px; }
.start-view form { margin-bottom: 20px; }

/* login */
form.login { float: left; width: 280px; padding: 15px; background-color: #f8f8f9; border: 3px solid #eeeeef; border-radius: 3px; box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 1); }
form.login span.title { float: left; width: 100%; font-size: 18px; margin-bottom: 10px; }
form.login input { float: left; width: 260px; }
form.login .button-line { float: left; width: 272px; margin-top: 40px; }
form.login input.button { float: right; width: auto; }
form.login input.checkbox { width: auto; }
form.login a { float: left; }
form.login span.error-message { float: left; width: 100%; }
form.login fieldset { float: left; width: 100%; border: 0px; }
form.login fieldset .inner { display: none; float: left; width: 100%; margin-top: 20px; padding-top: 19px; border-top: 1px solid #ddd; }

/* registration */
form.registration { float: right; width: 280px; padding: 15px; background-color: #f8f8f9; border: 3px solid #eeeeef; border-radius: 3px; box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 1);}
form.registration span.title { float: left; width: 100%; font-size: 18px; margin-bottom: 10px; }
form.registration input { width: 260px; }
form.registration .button-line { margin-top: 40px; }
form.registration a.button { color: #888; }
form.registration input.button { float: right; width: auto; }
form.registration input.checkbox { width: auto; }
.confirm-view { width: 350px; margin: 0px auto 0px auto; }
.confirm-box { float: left; width: 300px; padding: 10px; background-color: #f8f8f9; border: 10px solid #e8e8eb; border-radius: 3px; box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 1); }

/* icon menu, icon categories */
.icon-menu { float: left; }
.icon-menu a { float: left; margin-left: 10px; margin-right: 20px; padding: 8px 3px 8px 0px; }

/* icon view */
.icon-view h1 { margin: 6px; }
.icon-view nav { float: left; }
.icon-view nav a { float: left; padding: 8px; }

.icon-view ul.category-list { float: left; width: 100%; }
.icon-view ul.category-list, .icon-view ul.category-list ul li { float: left; }
.icon-view ul.category-list li a { float: left; padding: 8px; }
.icon-view ul.category-list li span { float: left; padding: 8px; color: #888; font-weight: 600; font-family: 'Open Sans', sans-serif; font-weight: 600; text-transform: uppercase; }

.icon-view { float: left; width: 100%; }
.icon-view ul.icon-list { float: left; width: 100%; }
.icon-view ul.icon-list li { float: left; width: 130px; overflow: hidden; list-style-type: none; background-color: #fff; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; border-left: 1px solid #dddddf; border-top: 1px solid #dddddf; border-radius: 5px; margin: 6px; /* box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.1); */ }
.icon-view ul.icon-list li span { float: left; width: 100%; white-space: nowrap; padding: 3px; margin-bottom: 1px; background-color: #eeeef0; border-bottom: 1px solid #dddddf; font-size: 10px; }
.icon-view ul.icon-list li a { float: left; }
.icon-view ul.icon-list li a img { float: left; border: 0px; }

.icon-form .error-message { float: left; width: 100%; }
.icon-form input { float: left; width: 380px; }
.icon-form select { width: 300px; }

.share-icon { float: left; width: 100%; }
.share-icon img.share-icon-img { float: left; border: 1px solid #ddd; margin-bottom: 20px; }
.share-icon .relation-selector { width: 380px; margin-top: 10px; }

/* Account */
.change-password-form input { float: left; width: 380px; }

/* settings */
.settings nav { float: left; width: 100%; margin-top: 10px; }
.settings nav a { float: left; margin-right: 20px; }
.settings .settings-content { float: left; width: 645px; margin-top: 20px; }

.settings .settings-content .category-editor { float: left; width: 100%; margin-top: 20px; }
.settings .settings-content .category-editor .line input { float: left; width: 300px; }
.settings .settings-content .category-editor .line a { float: right; margin: 6px 0px 0px 0px; }
.settings .settings-content .category-editor .line a.save { display: none; float: left; width: auto; margin-left: 20px; }
.settings .settings-content .category-editor .line { margin-bottom: 10px; }

.settings .settings-content .news-editor ul.news-sources { float: left; width: 100%; margin-bottom: 50px; margin-top: 20px; }
.settings .settings-content .news-editor ul.news-sources li { float: left; width: 133px; padding: 10px; }
.settings .settings-content .news-editor ul.news-sources li.line { width: 100%; }
.settings .settings-content .news-editor ul.news-sources li label { float: left; width: auto; margin: 0px 0px 0px 10px; }
.settings .settings-content .news-editor ul.news-sources li input { float: left; }
.settings .settings-content .news-editor ul.news-categories { float: left; width: 100%; margin-top: 10px; }
.settings .settings-content .news-editor ul.news-categories li { float: left; width: 133px; padding: 10px; }
.settings .settings-content .news-editor ul.news-categories li.line { width: 100%; }
.settings .settings-content .news-editor ul.news-categories li label { float: left; width: auto; margin: 0px 0px 0px 10px; }
.settings .settings-content .news-editor ul.news-categories li input { float: left; padding: 0px; }

/* relations */
.relations { float: left; width: 100%; }
.relations h1 { margin: 10px;  }
.relations ul { float: left; width: 100%; }
.relations ul li { float: left; width: 150px; height: 50px; margin: 6px 2px 6px 10px; overflow: hidden; list-style-type: none; background-color: #f8f8f8; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; border-left: 1px solid #dddddf; border-top: 1px solid #dddddf; border-radius: 5px; }
.relations ul li a { float: left; width: 100%; height: 100%; }
.relations ul li a .frame { float: left; width: 50px; height: 50px; overflow: hidden; }
.relations ul li a .frame img { float: left; border: 0px; height: 50px; }
.relations ul li a span { float: right; width: 90px; padding: 2px 5px 2px 5px; }
.relations ul.requested-relations { border-bottom: 1px dotted #ddd; padding-bottom: 20px; margin-bottom: 20px; }
form.relation-search-form { float: left; width: 100%; }
form.relation-search-form input { float: left; margin: 10px; width: 300px; }
form.relation-search-form .button { float: left; padding: 5px; margin-left: 0px; width: auto; }

/* relation selector */
.relation-selector { float: left; }
.relation-selector input { float: left; width: 100%; }
.relation-selector ul { float: left; width: 98%; border-left: 1px solid #ccccce; border-right: 1px solid #ccccce; border-radius: 3px; box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.16);}
.relation-selector ul li { float: left; width: 100%; border-bottom: 1px solid #ccccce; }
.relation-selector ul li a { float: left; width: 100%; }
.relation-selector ul li a:hover { background-color: #eee; }
.relation-selector ul li a img { float: left; width: 40px; height: 40px; }
.relation-selector ul li a span { float: left; margin-top: 12px; margin-left: 10px; }
.relation-selector div { float: left; width: 100%; }
.selected-relations { float: left; width: 100%; }
.selected-relations img { float: left; width: 40px; height: 40px; margin-right: 5px; margin-top: 5px; cursor: pointer; }

/* profile card */
.profile-card { position: absolute; z-index: 10; width: 300px; padding: 10px 10px 5px 10px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.16); }
.profile-card .frame { float: right; border: 1px solid #ddd; border-radius: 3px; }
.profile-card .frame img { float: left; padding: 4px; border-radius: 3px; }
.profile-card span { float: left; font-size: 14px; width: 170px; padding-right: 10px; }
.profile-card p { margin-top: 5px; width: 170px; padding-right: 10px; }
.profile-card p.info { color: #888; }
.profile-card .footer { float: left; width: 100%; padding-top: 10px; margin-top: 15px; margin-bottom: 5px; border-top: 1px dotted #ddd; }
.profile-card .footer .button-line { float: right; }
.profile-card .footer .button-line .button { margin-left: 10px; }

/* profile */
.profile { border-right: 0px; }
.profile form { margin-top: 10px; }
.profile form.profile-base { float: left; width: 450px; padding-right: 25px; border-right: 1px dotted #ccccce; }
.profile form.profile-base .line { margin-bottom: 10px; }
.profile form.profile-base .line label { width: 150px; margin-top: 10px; }
.profile form.profile-base .line input, .profile form .line textarea, .profile form .line select { float: right; width: 250px; }
.profile form.profile-base .line #user_birthdate select { float: left; width: auto; margin-left: 5px; }
.profile form.profile-base .line fieldset { float: right; }
.profile form.profile-base fieldset { border: 0px; }
.profile form.profile-base .button-line { float: right; margin-top: 10px; }
.profile form.profile-base .button { margin-left: 10px; }
.profile form.picture-upload { float: right; width: 165px; }
.profile form.picture-upload .frame { float: left; width: 150px; text-align: center; padding: 3px; border: 1px dotted #ccccce; border-radius: 3px; }
.profile form.picture-upload .button { float: left; width: 100%; margin-top: 10px; text-align: center; }
.profile form.picture-upload span { float: left; width: 100%; text-align: center; color: #888; }

/* widgets */
.widgets { position: absolute; z-index: 2; width: 270px; top: 10px; right: 10px; background-color: #eeeef0; border: 5px solid #dddddf; box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.0); border-radius: 5px; }
.widget { float: left; width: 250px; margin: 0px 10px 0px 10px; padding: 10px 0px 10px 0px; border-top: 1px solid #fff; border-bottom: 1px solid #dddddf; }

.account { margin-top: 5px; border-top: 0px; }
.account a { float: left; margin-right: 20px;}

.name-day .left { width: 50px; }
.name-day .right { width: 193px; }
.name-day .week { background-color: #e4e4e6; border-radius: 3px; border: 1px solid #d4d4d6; }
.name-day .week span { float: left; width: 100%; font-size: 10px; text-align: center; }
.name-day .week strong { float: left; width: 100%; text-align: center; font-size: 20px; font-weight: normal; }
.name-day .right span { float: left; width: 100%; text-align: right; overflow: hidden; white-space: nowrap; margin: 2px 0px 4px 0px; }

/* weather */
.weather img { float: left; }
.weather span { float: right; font-size: 24px; margin-top: 13px; color: #446; }

/* radio */
.radio #radio_list { float: left; width: 100%; }
.radio ul { float: left; display: none; background-color: #e4e4e6; padding: 5px; border-radius: 3px; border: 1px solid #d4d4d6; }
.radio ul li { float: left; width: 108px; margin: 0px 5px 0px 5px; list-style-type: none; }
.radio ul li a { float: left; width: 100%; padding: 5px 0px 5px 0px; }
.radio #player-hidden { float: left; width: 1px; height: 1px; overflow: hidden; }
.radio .player { float: left; width: 100%; padding: 5px 0px 5px 0px; }
.radio .player #status-button { float: left; width: 22px; height: 22px; margin-left: 5px; margin-top: 1px; background-image: url('DefaultImages/play.png'); }
.radio .player #status-button.stop { background-image: url('DefaultImages/stop.png'); }
.radio .player #selected-radio { float: right; width: 150px; padding: 4px 8px 4px 8px; background-color: #e4e4e6; border-radius: 3px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border: 1px solid #d4d4d6; }
.radio .player #select-button { float: right; padding: 4px 8px 4px 8px; background-color: #e4e4e6; border-radius: 3px; border-top-left-radius: 0px; border-bottom-left-radius: 0px;  border-top: 1px solid #d4d4d6; border-right: 1px solid #d4d4d6; border-bottom: 1px solid #d4d4d6; background-image: url('DefaultImages/arrow-down.gif'); background-position: center; background-repeat: no-repeat;}

/* Facebook like box */
.facebook-like-box { border-bottom: 0px; }
.facebook-like-box h1 { width: 100%; text-align: center; margin-bottom: 10px; margin-top: 10px; color: #064199; }
.facebook-like-box .fb-like-box { background-color: #f8f8fa; border: 1px solid #ddd; border-radius: 3px; }

/* calendar */
.calendar * { font-size: 10px; }
.calendar div { float: left; width: 100%; overflow: hidden; padding: 2px 0px 2px 0px; background-color: #eeeef0; }
.calendar span { float: left; width: 100%; font-weight: bold; text-align: center; }
.calendar .current-time span { text-transform: uppercase; font-weight: normal; margin-bottom: 10px; }
.calendar a { float: left; width: 27px; margin: 3px; }
.calendar a.today-button { width: 166px; }
.calendar .short-weeks a, .calendar .days a.empty-cell { background-color: transparent; border: 1px solid #eeeef0; font-weight: bold; cursor: default; text-align: center; }
.calendar .days a.marked-day, .calendar .days a.right-marked-day { background-color: #d7eaa6; }
.calendar .days a.marked-day:hover, .calendar .days a.right-marked-day:hover { background-color: #b9da61; }
.calendar .days a.marked-day-selected, .calendar .days a.day-selected, .calendar .days a.right-day-selected, .calendar .days a.right-marked-day-selected { background-color: #e7e1a0; }
.calendar .days a.marked-day-selected:hover, .calendar .days a.day-selected:hover, .calendar .days a.right-marked-day-selected:hover, .calendar .days a.right-day-selected:hover { background-color: #d8cf65; }

/* reminder */
.reminder span { float: left; width: 100%; font-weight: bold; }
.reminder ul, .reminder ul li, .reminder ul li a, .reminder ul li span { float: left; width: 100%; overflow: hidden; }
.reminder ul { margin-bottom: 5px; }
.reminder ul li { width: 248px; margin-bottom: 2px; background-color: #e4e4e6; border-radius: 3px; border: 1px solid #d4d4d6; }
.reminder ul li a { width: 230px; margin-left: 5px; padding: 3px 0px 3px 0px; }
.reminder ul li a:hover { color: #a00; }
.reminder ul li span { font-weight: normal; }
.reminder .button { float: right; margin: 5px 0px 5px 0px; }

.event-form .left, .event-form .right { width: 390px; }
.event-form, .event-form label, .event-form input, .event-form strong, .event-form span { float: left; }
.event-form { width: 100%; }
.event-form input, .event-form textarea, .event-form label { width: 375px; }
.event-form textarea { float: left; height: 140px; }
.event-form span { margin: 8px 16px 8px 4px; color: #666; }
.event-form span { margin-right: 24px; }
.event-form input.short { width: 15px; }
.event-form .right .relations { float: left; width: 100%; }
.event-form .right .relations img { width: 40px; height: 40px; }
.event-form .right .relations span { margin: 6px 0px 0px 0px; }

.shared-event-details .left { width: 300px; border-right: 1px dotted #aaa; padding-right: 20px; }
.shared-event-details .left h1 { color: #000; text-transform: none; font-size: 13px; margin-bottom: 10px; }
.shared-event-details .left span { float: left; width: 100%; margin-bottom: 5px; }
.shared-event-details .left p { float: left; width: 100%; border-top: 1px solid #ddd; padding-top: 10px; color: #666; }
.shared-event-details .right { width: 460px; }
.shared-event-details .right .relations { float: left; width: 100%; margin-bottom: 30px; margin-top: 10px; }
.shared-event-details .right .relations img { width: 40px; height: 40px; margin: 5px; }
.shared-event-details .right span { color: #888; }

/* news */
.news-wrapper { float: left; border-right: 1px dotted #ddd; padding-right: 10px; margin-right: 10px; }
#news-settings-button { float: left; margin: 10px 0px 10px 20px; display: block;}
ul.news { float: left; margin-top: 10px; margin-left: 20px; }
ul.news li { float: left; width: 100%; margin-bottom: 10px; padding-bottom: 10px; }
ul.news li span.time { float: left; width: 100px; color: #888; }
ul.news li p { float: left; }

.news-wrapper ul.category-list { float: left; width: 100%; margin-left: 12px; margin-bottom: 10px; }
.news-wrapper ul.category-list, .icon-view ul.category-list ul li { float: left; }
.news-wrapper ul.category-list li a { float: left; padding: 8px; }
.news-wrapper ul.category-list li span { float: left; padding: 8px; color: #888; font-weight: 600; font-family: 'Open Sans', sans-serif; font-weight: 600; text-transform: uppercase; }

/* footer */
footer { float: left; width: 100%; margin-top: 20px; bottom: 0px; padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #eee; }
footer span { color: #aaa; text-transform: uppercase; font-size: 10px; }
footer a.button { color: #88a; font-size: 10px; }

.terms-privacy { padding: 20px; }
.terms-privacy p { line-height: 22px; }
.terms-privacy h1 { margin-top: 20px; margin-bottom: 5px; font-size: 12px; color: #000; }
.terms-privacy h2 { line-height: 22px; }

/* window */
#window { float: left; position: absolute; z-index: 10; border: 20px solid #fff; border-radius: 5px; box-shadow: 0px 0px 10px 10px rgba(0, 0, 0, 0.5); background-color: #fff; }
#window .header { float: left; width: 100%; height: auto; padding-bottom: 20px; }
#window .header h1 { float: left; font-family: 'Open Sans', sans-serif; }
#window .header a { float: right; margin: 0px; width: 10px; height: 10px; background-image: url('DefaultImages/button-cancel.png'); }
#window .content { float: left; width: 100%; background-color: #fff; padding-bottom: 10px; }
#window .footer { float: left; width: 100%; height: auto; padding-top: 30px; }
#window .footer .button-list { float: right; }
#window .footer .button-list a { float: left; margin-left: 20px; }
#cover { position: absolute; width: 100%; height: 100%; background-color: #000; opacity:0.4; filter:alpha(opacity=40); z-index: 9; }

/* ADMIN */
.pending-icons { float: left; width: 1000px; margin: 20px; }
.pending-icons ul { float: left; width: 100%; }
.pending-icons ul li { float: left; width: 100%; background-color: #eee; margin-bottom: 20px; }
.pending-icons ul li a { float: left; width: 100%; background-color: #ddd; padding-top: 10px; padding-bottom: 10px; }
.pending-icons ul li img { float: left; border: 1px solid #ddd; margin: 10px; }
.pending-icons ul li form { margin: 22px 10px 10px 10px; }
.pending-icons ul li form span { float: left; width: 100%; margin-bottom: 0px;}

.reports { float: left; width: 1000px; margin: 20px; }
.reports ul.report-items { float: left; width: 100%; }
.reports ul.report-items li { float: left; border: 1px solid #ddd; background-color: #eee; padding: 20px; border-radius: 3px; margin-right: 20px; }
.reports ul.report-items li span { float: left; width: 100%; font-weight: bold; }
.reports ul.report-items li h1 { font-size: 24px; }
.reports ul.report-items ul li { width: auto; padding: 5px; margin: 5px 5px 5px 0px; }