@charset "utf-8";

/* Fonts */
@font-face {font-family:"Roboto";src:url("../fonts/Roboto-Light.eot?") format("eot"),url("../fonts/Roboto-Light.woff") format("woff"),url("../fonts/Roboto-Light.ttf") format("truetype"),url("../fonts/Roboto-Light.svg#Roboto-Light") format("svg");font-weight:normal;font-style:normal;}
@font-face {font-family:"Roboto";src:url("../fonts/Roboto-Medium.eot?") format("eot"),url("../fonts/Roboto-Medium.woff") format("woff"),url("../fonts/Roboto-Medium.ttf") format("truetype"),url("../fonts/Roboto-Medium.svg#Roboto-Medium") format("svg");font-weight:600;font-style:normal;}
@font-face {font-family:"Roboto";src:url("../fonts/Roboto-Bold.eot?") format("eot"),url("../fonts/Roboto-Bold.woff") format("woff"),url("../fonts/Roboto-Bold.ttf") format("truetype"),url("../fonts/Roboto-Bold.svg#Roboto-Bold") format("svg");font-weight:700;font-style:normal;}

/* Animation hack */
.anim {
	transform: translateZ(0);
}

/* General */
* {
	margin: 0;
	padding: 0;
	line-height: 125%;
	text-decoration:none;
	-webkit-text-size-adjust: 100%;
}

html {
	height: 100%;
}

body {
	height: 100%;
	font-family: Roboto, Arial, sans-serif;
	font-size: 14px;
	background-color: #CCC;
	background-image:url(../images/bg_oba_35.png);
}

u {
	text-decoration: underline;
}

a {
	cursor: pointer;
	text-decoration: none;
	color: #000;
}

a.textlink {
	color: #333;
	font-weight: bold;
	border-bottom-width: 1px;
	border-bottom-color: #333;
	border-bottom-style: dotted;
}

.small {
	font-size: 80%;
}

.full {
	width: 100%;
	height: 100%;
}

.floatleft {
	float: left;
	padding-right: 10px;
}

.floatright {
	float: right;
	padding-left: 10px;
}

.clearfix {
	clear: both;
	float: none !important;
}

.clearfixspace {
	clear: both;
	float: none !important;
	height: 1px;
}

.locked {
	opacity: 0.5;
}

.invisible {
	display: none;
}

ul {
	list-style: none;
}

div.vcenter {
	display: table;
}

div.vcenter span.cell {
	display: table-cell;
	vertical-align: middle;
}

.small {
	font-size: 80%;
}


section, header, nav, main {
	display: block;
}

header, nav {
	z-index: 300000;
}

section {
	z-index: 200000;
}

main {
	z-index: 100000;
}


/* ---- HEADER ---- */
header {
	position: fixed;
	top: 0;
	left: 0;
	height: 50px;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	width: 100%;
	box-shadow: 0 5px 10px #333;
}

#titlebox {
	position: absolute;
	top: 0;
	left: 10px;
	height: 33px;
	padding: 17px 60px 0 0;
}


#obalogo {
	position: absolute;
	top: 0;
	right: 10px;
	height: 33px;
	text-align: right;
	padding: 17px 60px 0 0;
	background-image:url(../images/oba_header_logo.svg);
	background-size: 50px 50px;
	background-repeat: no-repeat;
	background-position: right top;
}

/* ---- NAVIGATION ---- */
#menustart {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	height: 33px;
	padding: 17px 20px 0 50px;
	font-weight: 700;
}

nav {
	text-align: center;
	margin: 0 240px 0 240px;
	min-width: 160px;
}

nav ul li {
	display: inline-block;
}

nav ul li a {
	display: block;
	height: 28px;
	padding: 17px 15px 0 30px;
	border-style: solid;
	border-width: 0 0 5px 0;
	border-color: rgba(255, 255, 255, 0);
}

nav ul li a.active {
	border-color: rgba(0, 0, 0, 0.4);
}

#navigation {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 110%;
	height: 100%;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	z-index: 1000000;
}

#navigation ul {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 280px;
	min-height: 100%;
	background-color: #FFF;
	box-shadow: 10px 0 10px #777;
}

#navigation ul li.topgradient {
	position: fixed;
	top: 0;
	left: inherit;
	height: 20px;
	width: inherit;
	background: linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0));
}

#navigation ul li.bottomgradient {
	position: fixed;
	bottom: 0;
	left: inherit;
	height: 20px;
	width: inherit;
	background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
}

#navigation ul li.spacer {
	height: 114px;
}

#navigation ul li a {
	display: block;
	border-width: 0 0 1px 0;
	border-color: #555;
	border-style: solid;
	padding: 8px 10px 4px 35px;
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: 7px 5px;
}

#navigation ul li a:hover {
	color: #FFF; 
	background-color: #AAA;
}


#navigation ul li.title {
	margin-top: 15px;
	border-width: 0 0 1px 0;
	border-color: #555;
	border-style: solid;
	font-weight: bold;
	padding: 10px 10px 6px 10px;
}

#navigation ul li.username {
	position: absolute;
	bottom: 0;
	font-size: 80%;
	color: #555;
	padding: 10px 10px 20px 10px;
}

#menuclose {
	display: block;
	position: fixed;
	left: 0;
	right: 0;
	width: auto;
	height: 100%;
	margin-left: 280px;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: 10px 13px;
	background-image:url(../images/nav_close.svg);
	background-color: rgba(0,0,0,0.5);
}

#navigation a.logout {
	position: absolute;
	bottom: 44px;
	width: 235px;
	border-width: 1px 0 1px 0 !important;
}

#navigation a.logout:hover {
	color: #FFF;
	background-color: #970011;
}

#navigation a.membermenu {
	background-color: #a2b8a4;
}
#navigation a.membermenu:hover {
	background-color: #627d65 !important;
}

#navigation a.transactionmenu {
	background-color: #a2a9b8;
}
#navigation a.transactionmenu:hover {
	background-color: #646c7d !important;
}

#navigation a.invoicemenu {
	background-color: #b8aaa2;
}
#navigation a.invoicemenu:hover {
	background-color: #6b5f58 !important;
}

#navigation a.adminmenu {
	background-color: #b8b7a2;
}
#navigation a.adminmenu:hover {
	background-color: #6f6e5a !important;
}


/* ---- TITLEBAR ---- */
#titlebar {
	position: relative;
	padding: 64px 10px 6px 10px;
	border-style: solid;
	border-width: 0 0 1px 0;
	border-color: #666;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
}

#titlebar h1 {
	font-size: 20px;
	font-weight: normal;
	text-align: center;
}

/* ---- NOTIFICATION ---- */
#notification {
	position: fixed;
	bottom: 5px;
	right: 10px;
	width: 280px;
	z-index: 1200000;	
}

#notification div {
	width: 290px;
	overflow: hidden;
}

#notification span {
	display: block;
	position: relative;
	cursor: pointer;
	width: 264px;
	padding: 8px;
	margin: 5px 0;
	border-radius: 5px;
	background-color: #FFF;
	box-shadow: 5px 5px 5px #333;
}

#notification h1 {
	font-weight: bold;
	font-size: 100%;
	padding-bottom: 4px;
	margin-bottom: 4px;
	border-bottom: 1px solid #333;
}

#notification a {
	display: block;
	position: absolute;
	top: 5px;
	right: 5px;
}


/* ---- MAIN ---- */
main {
	padding: 20px 10px;
}

main.pagefill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin-top: 80px;
	padding: 0 !important;
	width: 100%;
	height: auto;
}

div.infobox {
	padding: 10px 10px;
	border-radius: 5px;
	font-weight: bold;
	background-image: linear-gradient(35deg, rgba(128,158,165,0.85), rgba(155,186,158,0.55)) !important;
	margin-bottom: 20px;
}

div.warningbox {
	padding: 8px;
	border-radius: 5px;
	background-image: linear-gradient(35deg, rgba(230,150,50,0.40), rgba(230,50,50,0.40));
}

div.alert {
	padding: 10px 10px;
	border-radius: 5px;
	font-weight: bold;
	background-image: linear-gradient(35deg, rgba(230,150,50,0.40), rgba(230,50,50,0.40));
	margin-bottom: 20px;
}

/* ---- COLUMN LAYOUT ---- */
div.twocolumns {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
}

.twocolumngroup {
	display: inline-block;
	margin-bottom: 12px;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid-column; 
	hyphens: auto;
}


/* ---- LISTS ---- */
ul.bullets li {
	position: relative;
	display: block;
	margin: 5px 0 5px 15px;
}

ul.bullets li::before {
	content: "–";
	position: absolute;
	left: -15px;
	top: 0;
}

ul.lines li {
	display: block;
	border-style: solid;
	border-width: 0 0 1px 0;
	border-color: #555;
}

ul.lines li:first-child {
	border-top-width: 1px;
}

ul.lines li:hover {
	background-color: rgba(238,238,238,0.65);
}

.leftauto {
	display: block;
	width: auto;
	overflow: hidden;
}

.righticon {
	display: block;
	width: 50px;
	overflow: hidden;
	float: right;
}

div.listicon {
	padding-left: 50px;
	padding-right: 10px;
	background-size: 40px 40px;
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 40px;
}

div.listnoicon {
	padding-right: 10px;
	height: 40px;
}

div.listwithicon {
	padding: 3px 0 3px 30px;
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: 0 2px;
}


/* ---- ICONS ---- */
img.tinyimgicon {
	width: 20px;
	height: 20px;
}

img.smallimgicon {
	width: 30px;
	height: 30px;
	padding: 5px;
}

img.imgicon {
	width: 40px;
	height: 40px;
	vertical-align: middle;
}

/* ---- NAV ICONS ---- */
.iconbig {
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: 10px 12px;
}

.icon {
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: 5px 14px;
}

.icon_accept {
	background-image:url(../images/nav_accept.svg);
}
.icon_calendar {
	background-image:url(../images/nav_calendar.svg);
}
.icon_checklist {
	background-image:url(../images/nav_checklist.svg);
}
.icon_deny {
	background-image:url(../images/nav_close_black.svg);
}
.icon_home {
	background-image:url(../images/nav_home.svg);
}
.icon_list {
	background-image:url(../images/nav_list.svg);
}
.icon_log {
	background-image:url(../images/nav_log.svg);
}
.icon_logout {
	background-image:url(../images/nav_logout.svg);
}
.icon_menu {
	background-image:url(../images/nav_menu.svg);
}
.icon_plus {
	background-image:url(../images/nav_plus.svg);
}
.icon_search {
	background-image:url(../images/nav_search.svg);
}
.icon_settings {
	background-image:url(../images/nav_settings.svg);
}

/* ---- FORMS ---- */
div.logincontainer {
	display: block;
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	padding: 30px;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	border-radius: 10px;
	box-shadow: 0 5px 10px #333;
	text-align: left;
}

div.autherror {
	font-weight: bold;
	color: #e2001a;
	margin-bottom: 20px;
}

fieldset {
	border-style: none;
}

fieldset.fullwidth {
	padding: 30px 30px 0 30px;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	border-radius: 10px;
	box-shadow: 0 5px 10px #333;
	text-align: left;
}


fieldset.narrow {
	max-width: 460px;
	margin-left: auto;
	margin-right: auto;
	padding: 30px 30px 0 30px;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	border-radius: 10px;
	box-shadow: 0 5px 10px #333;
	text-align: left;
}

fieldset.wide {
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
	padding: 30px 30px 0 30px;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	border-radius: 10px;
	box-shadow: 0 5px 10px #333;
}

fieldset dl {
	margin-bottom: 30px;
}

fieldset dd {
	margin-bottom: 15px;
}

fieldset dt {
	margin-bottom: 4px;
}

div.formbox {
	padding: 8px;
	border-style: solid;
	border-width: 1px;
	border-color: #555;
	border-radius: 5px;	
	margin-bottom: 8px;
}

div.formboxcontentleft {
	float: left;
	clear: left;
	width: 422px;
}

div.formboxcontentright {
	float: right;
	clear: right;
	width: 422px;
}



input.textinput, textarea.textinput {
	font-family: Roboto, Arial, sans-serif !important;
	font-size: 13px !important;
	width: 100%;
	border-style:solid;
	border-width: 1px;
	border-color: #555;
	padding: 5px;
	border-radius: 5px;
	font-weight: bold;
	box-sizing: border-box;
}

textarea.textinput {
	height: 150px;
	resize: none;
}

input.textinput:focus, textarea.textinput:focus, input.datepicker:focus {
	box-shadow: inset 0 0 10px #777;
}

input.datepicker {
	font-family: Roboto, Arial, sans-serif !important;
	font-size: 13px !important;
	width: 250px;
	border-style:solid;
	border-width: 1px;
	border-color: #555;
	padding: 5px;
	border-radius: 5px;
	font-weight: bold;
	box-sizing: border-box;
}

input.missing, textarea.missing {
	border-color: #e2001a !important;
	background-color: #ffdfe3 !important;
	background-image: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,223,227,1));
}

input.formbutton {
	cursor: pointer;
	min-width: 80px;
	text-align: center;
	border-style:solid;
	border-width: 1px;
	border-color: #555;
	padding: 5px 10px;
	border-radius: 5px;
	font-weight: bold;
	background-color: #AAA;
}

input.formbutton:hover {
	color: #EEE !important;
	background-color: #555 !important;
}

input.invalid {
	border-color: #e2001a !important;
	background-color: #ffdfe3 !important;	
	background-size: 13px 13px, auto;
	background-repeat: no-repeat;
	background-position: right 5px center, center;
	background-image: url(../images/stat_fail.svg), linear-gradient(90deg, rgba(255,255,255,1), rgba(255,223,227,1));
	padding-right: 20px;
}

input.ok {
	background-size: 13px 13px, auto;
	background-repeat: no-repeat;
	background-position: right 5px center, center ;
	background-image: url(../images/stat_ok.svg), linear-gradient(90deg, rgba(255,255,255,1), rgba(210,255,210,1));
	padding-right: 20px;
}

input.validating {
	background-size: 13px 13px, auto;
	background-repeat: no-repeat;
	background-position: right 5px center, center;
	background-image: url(../images/stat_validate.svg), linear-gradient(90deg, rgba(255,255,255,1), rgba(255,220,150,1));
	padding-right: 20px;
}

input.error {
	border-color: #e2001a !important;
	background-color: #ffdfe3 !important;
	background-size: 13px 13px, auto;
	background-repeat: no-repeat;
	background-position: right 5px center, center;
	background-image: url(../images/stat_error.svg), linear-gradient(90deg, rgba(255,255,255,1), rgba(255,223,227,1));
	padding-right: 20px;
}

input.locked {
	pointer-events: none;
	color: #666;
}


div.missing {
	border-color: #e2001a !important;
	background-color: #ffdfe3 !important;
}

/* -- dropdown select --*/
div.selectboxcontainer {
	position: relative;
	margin-bottom: 15px;
}

div.selectbox {
	cursor: pointer;
	padding-top: 16px !important;
	padding-bottom: 16px !important;
}

ul.selectdropdown {
	display: none;
	position: absolute;
	padding: 5px;
	margin-left: 5px;
	margin-top: -20px;
	border-style: solid;
	border-width: 1px;
	border-color: #555;
	border-radius: 5px;
	background-color: #DDD;
	box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
	z-index: 700000;
}

ul.selectdropdown li {
	cursor: pointer;
	padding: 5px 0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #555;
}

ul.selectdropdown li:last-child {
	border-bottom-style: none !important;
}

ul.selectdropdown li:active {
	background-color: #888;
}

ul.selectdropdown li:hover {
	background-color: #FFF !important;
}

ul.selectdropdown li.active:hover {
	background-color: #999 !important;
}

/* -- ID Picker -- */
div.id-picker-info {
	display: none;
	position: absolute;
	top: -30px;
	box-sizing: border-box;
	padding: 5px;
	background-color: #EEE;
	color: #666;
	width: 100%;
	border-radius: 3px;

}

div.id-picker-result {
	position: absolute;
	width: 100%;
	top: 50px;
}

/* -- Checkbox -- */
label.cbcontainer {
	display: block;
	position: relative;
	margin-top: 3px;
	margin-bottom: 3px;
	cursor: pointer;
	user-select: none;
}

label.cbcontainer:hover {
	background-color: #DDD;
}

label.cbcontainer .description {
	padding-left: 20px;
}

label.cbcontainer input {
	position: absolute;
	opacity: 0;
}

label.cbcontainer .checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 15px;
	width: 13px;
	background-size: 13px 13px;
	background-repeat: no-repeat;
	background-position: 0 1px;
	background-image:url(../images/nav_checkbox.svg);
}

label.cbcontainer input:checked ~ .checkmark, label.cbcontainer .checked {
	background-image:url(../images/nav_checkbox_checked.svg) !important;
}

label.cbcontainer.inactive, label.cbcontainer input:disabled ~ .checkmark, label.cbcontainer input:disabled ~ .description {
	opacity: 0.5;
	cursor: auto !important;
}

/*--- DATEPICKER ---*/
div.calendarbox {
	display: none;
	position: absolute;
	width: 238px;
	margin-top: 5px;
	padding: 5px;
	border-style: solid;
	border-width: 1px;
	border-color: #555;
	border-radius: 5px;
	background-color: #DDD;
	box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
	z-index: 800000;
}

div.calendarbox table {
	width: 100%;
	border-spacing: 0;
    border-collapse: collapse;
}

div.calendarbox td.right {
	text-align: right;
}


div.calendarbox td.cal_month, div.calendarbox td.cal_year{
	font-weight: bold;
	text-align: center;
}

div.calendarbox table.calendar {
	table-layout: fixed;
}

table.calendar td, table.calendar th {
	border-width: 1px 1px 1px 1px;	
	border-style: solid;
	border-color: #555;
	text-align: center;
	padding: 2px;
}

table.calendar th {
	font-weight: bold;
	border-bottom: 0 !important;
}

table.calendar .weekend {
	color: #777;
}

table.cal_days td {
	cursor: pointer;
}

table.cal_days td.filler {
	color: #777;
}

table.cal_days td.today {
	box-shadow: inset 0 0 5px #777;
}

table.cal_days td.outofrange {
	background-color: #FFDFE3 !important;
}

table.cal_days td.active {
	color: #FFF !important;
	background-color: #777 !important;
	font-weight: bold;
}

table.cal_days td:hover {
	background-color: #FFF !important;
}

table.cal_days td.active:hover {
	background-color: #777 !important;
}

/* ---- WEBKIT and FIREFOX FORM FIX FOR HTML 5 INPUT FIELDS ---- */
input[type='number']::-webkit-inner-spin-button, 
input[type='number']::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type='number'] {
    -moz-appearance:textfield;
}

/* ---- MESSAGE BOX ---- */
div.cover {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color:rgba(0,0,0,0.5);
	z-index: 500000;
}

div.message {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	color: #FFF;
	margin: auto;
	padding: 10px;
	max-width: 280px;
	max-height: 280px;
	border-radius: 10px;
	background-color: #e2001a;
	box-shadow: 0 5px 10px #333;
}

div.confirm {
	color: #000 !important;
	background-color: #ffe100 !important;
}

div.footerbuttons {
	position: absolute;
	bottom: 0;
	padding: 10px;
	left: 0;
	right: 0;
	width: auto;
}

a.button {
	display: block;
	width: 80px;
	margin-top: 25px;
	color: #FFF;
	border-style:solid;
	border-width: 1px;
	border-color: #FFF;
	padding: 7px 15px;
	border-radius: 5px;
	font-weight: bold;
	text-align: center;
}

a.button_cancel {
	display: block;
	color: #000;
	padding: 20px 20px;
	border-radius: 5px;
	background-image: linear-gradient(35deg, rgba(165,128,132,85), rgba(155,186,158,0.55));
	box-shadow: 0 5px 8px #333;
	font-weight: bold;
	text-align: center;
}

a.button_ok {
	display: block;
	color: #000;
	padding: 20px 20px;
	border-radius: 5px;
	background-image: linear-gradient(35deg, rgba(128,158,165,0.85), rgba(155,186,158,0.55));
	box-shadow: 0 5px 8px #333;
	font-weight: bold;
	text-align: center;
}

a.button_inactive {
	pointer-events: none;
	display: block;
	color: #000;
	padding: 20px 20px;
	border-radius: 5px;
	background-image: linear-gradient(35deg, rgba(127,127,127,0.85), rgba(180,180,180,0.55));
	box-shadow: 0 5px 8px #333;
	font-weight: bold;
	text-align: center;
}

div.confirm a.button {
	color: #000 !important;
	border-color: #000 !important;
}

a.button:hover, div.confirm a.button:hover{
	background-color: #FFF !important;
	border-color: #CCC !important;
	color: #000 !important;
}

a.formbutton, div.formbutton {
	display: inline-block;
	cursor: pointer;
	border-style:solid;
	border-width: 1px;
	border-color: #555;
	padding: 5px 10px;
	border-radius: 5px;
	font-weight: bold;
	background-color: #AAA;
}

a.formbutton:hover, div.formbutton:hover, a.formbutton2:hover {
	color: #EEE !important;
	background-color: #555 !important;
}

a.closebutton {
	margin-left: auto;
	margin-right: auto;
}

a.okbutton {
	float: left;
}

a.cancelbutton {
	float: right;
}

/* ---- LOGS ---- */
ul.lognavigation {
	height: 20px;
	margin-bottom: 10px;
}

ul.lognavigation li {
	display: block;
	float: left;
	height: 20px;
	width: 23px;
}

ul.lognavigation li:last-child {
	clear:right;
}

ul.lognavigation li a {
	display: block;
	height: 20px;
	width: 100%;
	font-size: 80%;
	text-align: center;
}

ul.lognavigation li a.number {
	height: 15px !important;
	padding-top: 5px !important;
}

ul.lognavigation li a.active {
	font-weight: bold;
}

table.logs {
	width: 100%;
	font-size: 80%;
	border-spacing: 0;
    border-collapse: collapse;
}

table.logs tr {
	border-style: solid;
	border-width: 0 0 1px 0;
	border-color: #555;
}

table.logs tr.info {
	border-style: none !important;
}

table.logs tr:nth-child(even) {
	background-color: rgba(0,0,0,0.20);
}

table.logs tr:hover {
	background-color: rgba(255,255,255,0.50) !important;
}

table.logs td, th {
	padding: 5px;
}

table.logs th {
	text-align: left;
	font-weight: bold;
}

table.logs td:first-child, th:first-child {
	padding-left: 0 !important;
}
table.logs td:last-child, th:last-child {
	padding-right: 0 !important;
}

/*--- CALENDAR ---*/
table.res_calendar {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
}

table.res_caption {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

table.res_calendar th, table.res_calendar td, table.res_caption td {
	position: relative;
	height: 50px;
}

table.res_calendar th, table.res_calendar td {
	width: 14.285%;
	padding: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-color: #333;
}

table.res_day th, table.res_day td {
	padding: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-color: #333;
}

td.res_inactive {
	opacity: 0.5;
}

td.res_today {
	font-weight: bold;
	background-image: linear-gradient(35deg, rgba(128,158,165,0.85), rgba(155,186,158,0.55)) !important;
}

div.res_isclosed {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: auto;
	height: auto;
	background-image: linear-gradient(to top left,rgba(255,255,255,0) 48%, rgba(51,51,51,0.35), rgba(255,255,255,0) 52%);
}

div.res_isopen {
	position: absolute;
	top: 3px;
	left: 3px;
	right: 3px;
	width: auto;
	height: 8px;
	background-color: #333;
}
div.res_isevent {
	position: absolute;
	top: 3px;
	left: 3px;
	right: 3px;
	width: auto;
	height: 8px;
	background-image: linear-gradient(to bottom, rgba(51,51,51,1), rgba(51,51,51,1) 32%, rgba(255,255,255,0) 33%, rgba(255,255,255,0) 65%, rgba(51,51,51,1) 66%, rgba(51,51,51,1));
}

div.res_status {
	position: absolute;
	bottom: 8px;
	left: 50%;
	margin-left: -45%;
	height: 8px;
	width: 90%;
}

div.res_circle {
	display: inline-block;
	height: 10px;
	width: 10px;
	border-radius: 5px;
	margin-left: 1px;
	margin-right: 1px;
	background-color: #6b5f58;
}
div.res_personal {
	box-sizing: border-box;
	position: absolute;
	left: 50%;
	margin-left: -14px;
	top: 50%;
	margin-top: -14px;
	height: 28px;
	width: 28px;
	border-radius: 14px;
	border-width: 1px;
	border-style: solid;
	border-color: #646c7d;
}


td.res_box {
	width: 14.285%;
	padding: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-color: #333;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
}

td.res_spacer {
	width: 5.715%;
}

td.res_description {
	width: 80%;
}

/*--- CALENDAR NAVIGATION ---*/
table.res_navigation {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
	border-style: solid;
	border-width: 1px;
	border-color: #333;
}

table.res_navigation th, table.res_navigation td {
	position: relative;
	height: 50px;
	padding: 5px;
}
a.res_nav_prev {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 50%;
	background-size: 40px 40px, auto;
	background-repeat: no-repeat;
	background-position: left center;
	background-image: url(../images/nav_previous.svg);
}

a.res_nav_next {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 50%;
	background-size: 40px 40px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/nav_next.svg);
}

table.res_calendar td a, table.res_navigation td a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

/*--- DAY --- */
table.res_day {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
}

table.res_daycaption {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}
table.res_daycaption td {
	position: relative;
	padding: 5px;
	height: 28px;
}

table.res_day th, table.res_day td {
	position: relative;
	padding: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-color: #333;
}
table.res_day th {
	height: 50px;
}

table.res_day td {
	height: 28px;
}

table.res_day td:first-child {
	width: 25%;
}
table.res_day td:nth-child(2){
	width: 75%;
	text-align: left;
	padding-right: 50px !important;
}

td.res_day_open {
}

td.res_day_closed {
}

td.res_event_closed {
	background-image: linear-gradient(to top left,rgba(255,255,255,0) 48%, rgba(51,51,51,1), rgba(255,255,255,0) 52%);
}

td.res_added {
	background-image: linear-gradient(35deg, rgba(128,158,165,0.85), rgba(155,186,158,0.55)) !important;
}
td.res_adding {
	background-image: linear-gradient(35deg, rgba(155,186,158,0.55), rgba(200,200,200,0.55)) !important;
}
td.res_removing {
	background-image: linear-gradient(35deg, rgba(165,128,132,85), rgba(200,200,200,0.55)) !important;
}

table.res_daycaption td:first-child {
	width: 25%;
	position: relative;
	padding: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-color: #333;
	background-image: linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55));
}
td.res_cap_closed {
	background-image: linear-gradient(to top left,rgba(255,255,255,0) 49%, rgba(51,51,51,1), rgba(255,255,255,0) 51%), linear-gradient(35deg, rgba(255,255,255,0.85), rgba(200,200,200,0.55)) !important;
}

td.res_dayspacer {
	width: 5%;
}

td.res_daydescription {
	width: 70%;
}

div.res_event {
	box-sizing: border-box;
	position: absolute;
	top: 3px;
	bottom: 3px;
	left: 3px;
	height: auto;
	width: 8px;
}

div.res_event_junior {
	border-radius: 4px;
	background-color: #6b5f58;
}

div.res_event_free {
	background-image: linear-gradient(to top,	rgba(51,51,51,1) 23%, rgba(255,255,255,0) 24%, rgba(255,255,255,0) 38%, rgba(51,51,51,1) 39%,
												rgba(51,51,51,1) 60%, rgba(255,255,255,0) 61%, rgba(255,255,255,0) 75%, rgba(51,51,51,1) 76%);
}

div.res_event_coach {
	background-color: #333;
}

div.res_event_blocked {

}

div.res_event_key {
	width: 20px !important;
	background-size: 15px 15px, auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../images/nav_key.svg);
}

div.res_event_special {
	border-width: 2px;
	border-style: solid;
	border-color: #333;
}

div.res_event_event {
	width: 20px !important;
	background-size: 15px 15px, auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../images/nav_balloon.svg);
}

/*--- DAY NAVIGATION --- */
a.res_add {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-size: 30px 30px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/nav_plus.svg);
}

a.res_remove {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-size: 30px 30px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/nav_minus.svg);
}

a.res_sync {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-size: 30px 30px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/stat_sync.svg);
}

a.res_e_add {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-size: 20px 20px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/nav_plus.svg);
}

a.res_e_edit {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 50%;
	background-size: 20px 20px, auto;
	background-repeat: no-repeat;
	background-position: 15px center;
	background-image: url(../images/nav_edit.svg);
}

a.res_e_del {
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	height: 100%;
	width: 50%;
	background-size: 20px 20px, auto;
	background-repeat: no-repeat;
	background-position: right center;
	background-image: url(../images/nav_minus.svg);
}