*, *:before, *:after {box-sizing: border-box}
body, html {height:100%; font-size:16px; font-family: "Roboto", sans-serif; background:#F4F5F6; padding:0; margin:0;}
body {line-height:1.5; font-weight:normal; }
p, div {margin:0; line-height:1.5}
a {text-decoration:none; color:inherit; color:#2196F3;}

/* generic classes */
.spacer {height:20px;}
.clear {clear:both}
.template {display:none}
.pad10 {padding:10px;}
.pad20 {padding:20px;}
.bold {font-weight: bold;}
.msg.success {background:#80bd9c; text-align:center; font-size:18px}
.msg.message {background:#eee; text-align:center; font-size:18px; padding:20px 0!important;}
.frm.error {color:#fff; background:#f00; padding:1px 10px; font-size:10px; margin-top:-5px;}
.error, .red-letters {color:#f00;}
.pull-right {float:right;}
.pull-left {float:left;}
.underline {text-decoration:underline;}
.text-justified {text-align:justify; line-height:30px}
.abs {position: absolute;}
.rel {position: relative;}
.inbtn {height:100%; position:absolute; right:-10px; top:10px; background:#f00; color:#fff; border-radius:50%; display:inline-block;width:16px; height:16px;line-height:16px; text-align:center;}
.fw {width:100%;}
/*.error:before {content:"!"; background:#f00; color:#fff; border-radius:50%; display:inline-block; width:20px; height:20px; text-align:center; font-size:14px; font-weight: bold; margin:0 5px;}*/
.info {font-size:11px; font-style:italic; color:#777;}
.big {font-size:20px;}
.gray {background:#eee; padding:5px 0;}

.inline {border:none!important; margin:0!important; border-bottom:1px dotted #999!important; padding:4px!important; outline:none; color:#33f; font-weight: bold}
blockquote {padding:0; margin:4px 20px;}

/*.frm.error {color:#fff; background:#f00;padding:1px 10px; text-align:center; border-radius:5px 5px 0 0; font-size:10px; position:absolute; pointer-events:none; border-top:2px solid #fff; border-right:2px solid #fff; }*/
.has-error {border-color:#f00!important}
.hovering>.row {padding:10px; border-top:1px solid #eee}
.hovering>.row:last-child {padding:10px; border-bottom:1px solid #eee}
.hovering>.row:hover {background:#eee}
a.ticker {}
a.ticker:after{content:'✘'; color:#f00; font-size:18px; font-weight: bold;}
a.ticker.ticked:after{content:'✔'; color:#0f0;}
.form-label {margin-top:8px;}
.form-header {background:#777; color:#fff; display:block; padding:3px 10px; text-align:left; font-size:20px; margin-top:20px;}
.form-subheader {background:#aaa; color:#fff; display:block; padding:3px 10px; text-align:left; font-size:18px; margin:15px 0 10px 0;}
.print-subheader {display:block;font-size:20px; text-align:center; margin-top:20px; text-decoration: underline; font-weight: bold; letter-spacing:3px}
.print-letters {font-size:19px;}
.light-underline {border-bottom:1px solid #eee}
.bbottom {border-bottom:1px solid #333}
label {display:inline-block; padding:5px 0;}


.notetxt {background:#fbffbd; padding:2px 5px; box-shadow:1px 1px 1px #000; border-radius: 4px; color:#000; font-size: 10px}
.notetxt:hover {background:#fff; padding:2px 5px; box-shadow:1px 1px 1px #000; border-radius: 4px; color:#000; font-size: 10px}
/* popup */
#overlay {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.4); z-index:1}
#popup {position:fixed; top:100px; left:50%; margin-left:-160px; width:320px; background:#fff; border:1px solid #fff; box-shadow:5px 5px 5px #444; z-index:2}
#popup-title {padding:5px 10px; background:#000; color:#fff; text-shadow:1px 1px 1px #555;}
#popup-in {padding-top:10px}
.button-place {background:#eee; padding:10px 0; border-top:1px solid #ccc}
/* end popup */





.adata {display:block; background:#eee; color:#284; padding:0 3px; margin-left:20px; border-bottom:1px solid #ddd}
.adata:last-child {margin-bottom:10px;}
.data-guests_nr {color:#900}
.data-price_per_person {color:#009;}
.data-advance {color:#090;}
.help {display:inline-block; padding:0 5px; height:16px; background:#f00; color:#fff; font-weight: bold; border-radius:50%; line-height:16px; cursor:pointer;}
.helpinfo {display:inline-block; padding:0 5px; height:16px; background:#080; color:#fff; font-weight: bold; border-radius:50%; line-height:16px; cursor:pointer;}

#site {margin:0 auto;  padding-bottom:200px; border-left:1px solid #000; border-right:1px solid #000; background:#fff; min-height:100%; position:relative; overflow-x:hidden;}
#site-header {margin:0 auto; padding:20px 0; border-bottom:1px solid #000;}
#site-footer {margin:0 auto; padding:10px 0; border-top:1px solid #000; position:absolute; bottom:0}
#site-main {margin-bottom:80px;}

.approved {border-left:10px solid #ff0; background:#ffe}
.advance_paid {border-left:10px solid #0f0; background:#efe}
.active-event {border-left:10px solid #f00; background:#fee}


.row.service-categories {padding-top:20px;}
.service-categories a {display:inline; padding:3px 10px; margin-right:1px; background:#aaa; border-radius:4px 4px 0 0; color:#fff; border:1px solid #aaa; border-bottom:none; position:relative; top:1px; float:left; font-size:15px;}
.service-categories a.selected {background:#fff; color:#000;}
.service-categories a.plus {background:#444; color:#fff;}

.service-listing {border:1px solid #aaa; padding:20px;}


@media only print {
	.hide-print {display:none!important}
}

@media only screen {
	.show-print {display:none!important}
}




finalized



/* calendar listing */
/*#calendar-listing .adate {padding:10px 0; border-top:1px solid #eee; font-size:14px;}
#calendar-listing .adate.ss {background:#f4f4f4}
#calendar-listing .adate:last-child {border-bottom:1px solid #eee}
#calendar-listing .adate .day {text-align:center;font-size:25px;}
#calendar-listing .adate .date {text-align:center; font-size:32px; font-weight:bold}
#calendar-listing .datetime {position:relative;}
#calendar-listing .datetime a {position:absolute; top:35px; left:50%; margin-left:-24px; width:48px; height:48px; z-index:0; border-radius:50%; background:rgba(0,100,0, .5); font-size:35px; text-align: center;}
.events-place {border-left:1px solid #eee; min-height:100px;}*/
/* calendar listing */

#calendar-listing {font-size:14px;}
#calendar-listing .monthbox {position:relative;  padding:19px 0 0 1px}
#calendar-listing .monthbox.day {text-align:center; padding:5px; height:30px; background:#aaa; font-weight: bold; color:#fff;}
#calendar-listing .monthbox.day:hover {background:#aaa!important}
#calendar-listing .monthbox.sk {background:#eee}
#calendar-listing .monthbox:hover {background:#f0f0f0}
#calendar-listing .monthbox .the-date {position:absolute; top:0; left:4px; height:30px; font-size:12px; font-weight: bold;}
#calendar-listing .monthbox .add-event {position:absolute; top:1px; right:0; height:18px; width:18px; font-size:12px; text-align:center; background:#f00; color:#fff}
#calendar-listing .monthbox .data {color:#000; position: absolute; top:40px; left:20px; width:320px; height:auto; padding:5px; box-shadow:3px 3px 8px #000; z-index:1; border:1px solid #555;}

#calendar-listing .monthbox .unfixed {padding:1px 0 1px 5px; background:#fbffbd; border-top:1px solid #ebefad; border-bottom:1px solid #ebefad;  font-size:12px; color:#000}
#calendar-listing .monthbox .unfixed .data {background:#fbffbd;}

#calendar-listing .monthbox .finalized {padding:1px 0 1px 5px; background:#c7ffde; border-top:1px solid #b7efce; border-bottom:1px solid #b7efce;  font-size:12px; color:#000}
#calendar-listing .monthbox .finalized .data {background:#c7ffde;}

#calendar-listing .monthbox .completed {padding:1px 0 1px 5px; background:#f00; border-top:1px solid #ebefad; border-bottom:1px solid #ebefad;  font-size:12px; color:#000}
#calendar-listing .monthbox .completed .data {background:#fbffbd;}

#calendar-listing .monthbox .user-names {padding:5px 10px; position:absolute;top:0; left:0; width:100%; font-weight: bold; background:#2196F3; margin-bottom:10px; border-bottom:1px solid #555; color:#fff; text-shadow:1px 1px 0 #0176d3;}
#calendar-listing .monthbox .user-names>div {white-space:nowrap; text-overflow: ellipsis;}
#calendar-listing .monthbox .event-data {margin-top:30px;}
#calendar-listing .monthbox .text-data {margin-top:10px;}
#calendar-listing .monthbox .actions {margin-top:10px;}

#calendar-listing .monthbox .actions .button {text-align:center;}


.anote {padding:5px;}
.anote .note-date {font-size:10px; color:#888; text-align:right}
.anote .note-body {font-size:14px;}
.anote:nth-child(odd) {background:#eee}
.note-popup .delete_note {display:inline-block; background:#f00; color:#fff; padding:1px 4px;}
.note-popup textarea {width:100%;}

button, .button {font-size:13px;}

#calendar-listing .monthbox .event-hovered {background:#000!important; color:#f00!important;}
@media only screen and (max-width:320px) {
	#calendar-listing .monthbox {width: 100%}
}

@media only screen and (min-width:321px) {
	#calendar-listing .monthbox {width:14.27%; float:left; height:200px; box-shadow: 1px 0 0 0 #aaa, 0 1px 0 0 #aaa, 1px 1px 0 0 #aaa, 1px 0 0 0 #aaa inset, 0 1px 0 0 #aaa inset;}
}