@charset "utf-8";
/* CSS Document */

/* FOR DEBUGGING BOOTSTRAP WINDOWS SIZE
<? // if ($debug) { ?>
<div class="visible-xs">XS</div>
<div class="visible-sm">SM</div>
<div class="visible-md">MD</div>
<div class="visible-lg">LG</div>
<? // } ?>

OR

<div class="visible-xs well">XS</div>
<div class="visible-sm well">SM</div>
<div class="visible-md well">MD</div>
<div class="visible-lg well">LG</div>

*/

/* Sticky footer styles
----------------------- */
* html {
	zoom: 1;	
}
html {
	position: relative;
	min-height: 100%;
}
body {
	/*font-size: 100%;*/
	margin: 10px;
	font-family: "system-ui" !important;
	/*font-family: 'Helvetica Neue', Arial, sans-serif;
	/* Margin bottom by footer height */
	margin-bottom: 60px;
}
input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input, select {
	height: 34px; /* !important; */
}

.form-control
{
	padding:4px !important;
}

.reset_inputheight /* overrule the above rule */ {
	height: 34px !important;
}
.input-xs, select.input-xs {
	height: 20px;
	line-height: 20px;
	font-size: 10px;
	padding: 2px;
}
blockquote p {
	/*font-size:none !important;*/
	line-height: inherit !important;
	margin-bottom: inherit !important;
}
.well blockquote {
	border-left: none !important;
}
select, option {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	max-width: 100% !important;
}
#footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	/* Set the fixed height of the footer here */
	height: 60px;
	margin-top: 5px;
	background-color: #f5f5f5;
}
.btn {
	margin-bottom: 1px !important;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden; /*max-width: 200px;*/
}
.btn-default {
	background-color: #EEE;
}
.borderless table {
	border-top-style: none;
	border-left-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border: none;
}
body > .container {
	padding: 60px 15px 0;
}
body > .container-fluid {
	padding-top:60px;
}
.container .text-muted {
	margin: 20px 0;
}
#footer > .container {
	padding-right: 15px;
	padding-left: 15px;
}
code {
	font-size: 80%;
}
.red {
	color: #A94442;
}
.green {
	color: #00D359;
}
.white {
	color: #FFF;
}
.blue {
	color: #31708F;
}
.orange {
	color: #FF8600;
}
.grey {
	color: #CCC;
}
.darkgrey {
	color: #777;
}
h1 {
	/*font-size: 1.75em;*/
	margin: 0 0 0 0;
	margin-bottom: 10px;
}
a {
	color: #2996cc;
}
a:hover {
	text-decoration: none;
}
.small {
	/*color: #666;*/
	font-size: 0.875em;
}
.xsmall {
	/*color: #666;*/
	font-size: 0.675em;
	line-height: 1em;
}
.large {
	font-size: 1.25em;
}
.page-header /* tweak */ {
	margin-top: 10px;
}
.thumb {
	width: 35px;
	height: 35px;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td /* , .table > tbody > tr > td, .table > tfoot > tr > td */
{
	/*text-align:center;*/
	/* force all table contents to break for resizing*/
	/*word-break:break-all;*/
	vertical-align: middle;
	-ms-word-break: break-all;
	word-break: break-all;
	word-break: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.table > tbody > tr > td, .table > tfoot > tr > td {
	text-overflow: ellipsis;
	/*white-space: nowrap;*/
	overflow: hidden;
}
table.dataTable tbody th, table.dataTable tbody td {
    padding: 4px 4px;
}

.td-buttons /* Allow overflow of dropdown button outside of table cells */ {
	text-overflow: clip !important;
	white-space: normal !important;
	overflow-x: visible !important;
	overflow-y: visible !important;
}

@media (min-width: 767px) {
/* make dropdowns show on hover */
.dropdown:hover .dropdown-menu
{
/*	display: block;*/
}
}
/* For DB edit */
.tablecell {
	float: left;
	/*border: 1px #CCC solid;*/
	padding: 4px;
	margin-right: 3px;
	margin-bottom: 3px;
	min-height: 45px;
	min-width: 40px;
	white-space: nowrap;
	vertical-align: bottom;
	max-width: 100%;
}
.tablecell img {
	margin-right: 2px;
}
/* = Mouse-over pop-up tooltip =======================
Also needed for mini-calendar
Usage: This is <a class="info" href="javascript:void(null);">some text<div>This is the tooltip</div></a> which you have.
*/

a.infowide, a.info, a.info_small {
	position: relative; /*this is the key*/
	z-index: 24;
	text-decoration: none;
}
a.infowide:hover, a.info:hover, a.info_small:hover {
	z-index: 25;
}
a.infowide:hover, a.info:hover, a.info_small:hover {
	z-index: 25;
	background-color: #fff;
	text-decoration: none;
} /* must be here for IE !!!??? */
a.infowide span, a.info span, a.info div, a.info_small span {
	display: none;
}
a.infowide:hover span, a.info:hover span, a.info:hover div, a.info_small:hover span {
	font-size: 11px;
	font-weight: normal;
	display: block;
	width: 230px;
	position: absolute;
	left: 22px;
	top: -2px;
	background-color: #FFF;
	color: #000;
	white-space: normal;
	text-align: left;
	text-decoration: none;
	padding: 5px;
	-moz-box-shadow: 0px 0px 18px #999;
	-webkit-box-shadow: 0px 0px 18px #999;
	box-shadow: 0px 0px 18px #999;
}
a.infowide img, a.info img {
/*margin-right:6px;*/
}
a.info_small:hover span {
	left: 15px;
	width: 80px;
}
a.infowide:hover span {
	text-align: right;
	top: -200px;
	left: -515px;
	width: 500px;
}
a.infowide:hover span p, a.info:hover span p {
	margin-top: 0px;
	margin-bottom: 1px;
	padding-top: 2px;
}
.clear, .clearer {
	clear: both;
}
label {
	font-size: 9px;
	margin-left: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	color: #AAA;
	display: block;
	margin-top:8px; /* to space the fields */
} /* clear:both; */
.alert-sm {
	padding: 5px !important;
}
/* Make image responsive */
#cms_body img {
	/*border:#000 1px solid;*/
	max-width: 100%;
	height: auto !important;
	display: block;
	
}
.floating-left {
	float: left;
	max-width: 50%;
	width: 41.66% !important;
}
/* Force titles on new lines, e.g when left aligned image above */
h1, h2, h3, h4 {
	clear: both;
    margin-top:0px;
}
/* detect if image is floated left/rignt and add marings --- note the space */
img[style*="float:left"], img[style*="float: left"] {
	margin-top: 5px;
	margin-right: 10px;
}
img[style*="float:right"], img[style*="float: right"] {
	margin-top: 5px;
	margin-left: 10px;
}
/* === modernize Fotoalbum === */

#photo-album-container, #photo-photo-container {
	background: none;
	border: none;
	margin-bottom: 0px;/*padding: 0px;*/
}
.photo-album-box {
	margin: 0 0 0 0;
	border: none;
	background-color: inherit;
}
.photo-navigation-breadcrumb, .photo-navigation-breadcrumb strong {
	font-size: inherit;
}
.photo-album-readme * {
	font-size: 12px;
}
/* ATC - AddToCalendar styling -- http://addtocalendar.com */
/* Add FontAwesome calendar icon */
/*.atcb-link::before
{
	font-family: FontAwesome;
	content: "\f073   ";
}
*/
/* Restyle buttons so they look more like Bootstrap */
.atc-style-blue {
	text-align: center;
}
.atc-style-blue .atcb-link {
	background-color: #337AB7 !important;
	border-color: #2E6DA4 !important;
	font-size: 14px;
	font-weight: 400;
	font-family: inherit !important;
	border-image-width: 1 1 1 1 !important;
	height: 34px;
	padding-bottom: 2px;
	width: auto !important;
	padding-left: 12px !important;
	padding-right: 12px !important;
}
.atc-style-blue .atcb-link:hover {
	background-color: #286090 !important;
	border-color: #204D74 !important;
	border-image-width: 1 1 1 1 !important;
	padding-left: 12px !important;
	padding-right: 12px !important;
}
.atc-style-blue .atcb-link:active {
	background-color: #337AB7;
	border-color: #204D74;
	border-image-width: 1 1 1 1 !important;
	padding-left: 12px !important;
	padding-right: 12px !important;
}
.atc-style-blue .atcb-link:focus {
	background-color: #286090;
	border-color: #204D74;
	padding-left: 12px !important;
	padding-right: 12px !important;
}
/* for email */
.label {
	display: inline;
	padding: .2em .6em .3em;
	font-size: 75%;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: .25em
}
.label[href]:hover, .label[href]:focus {
	color: #fff;
	text-decoration: none;
	cursor: pointer
}
.label:empty {
	display: none
}

.fa-15x, .fa-stack-15x { font-size: 1.5em; }
.fa-stack-1x { margin-top: -2px; }

.btn .label {
	position: relative;
	top: -1px
}
.label-default {
	background-color: #999
}
.label-default[href]:hover, .label-default[href]:focus {
	background-color: gray
}
.label-primary {
	background-color: #428bca
}
.label-primary[href]:hover, .label-primary[href]:focus {
	background-color: #3071a9
}
.label-success {
	background-color: #5cb85c
}
.label-success[href]:hover, .label-success[href]:focus {
	background-color: #449d44
}
.label-info {
	background-color: #5bc0de
}
.label-info[href]:hover, .label-info[href]:focus {
	background-color: #31b0d5
}
.label-warning {
	background-color: #f0ad4e
}
.label-warning[href]:hover, .label-warning[href]:focus {
	background-color: #ec971f
}
.label-danger {
	background-color: #d9534f
}
.label-danger[href]:hover, .label-danger[href]:focus {
	background-color: #c9302c
}
/* Equal height for columns 
http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-columns-of-same-height
USAGE
<div class="row">
  <div class="row-height">
    <div class="col-xs-2 col-xs-height col-xs-middle">
      <div class="inside"></div>
    </div>
    <div class="col-xs-4 col-lg-5 col-xs-height col-xs-middle">
      <div class="inside"></div>
    </div>
  </div>
</div>
*/
/* content styles */
.inside {
	margin-top: 20px;
	margin-bottom: 20px;
	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4f4f4), color-stop(100%, #ededed));
	background: -moz-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
	background: -ms-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
}
.inside-full-height {
	/*
  // if you want to give content full height give him height: 100%;
  // with content full height you can't apply margins to the content
  // content full height does not work in ie http://stackoverflow.com/questions/27384433/ie-display-table-cell-child-ignores-height-100
  */
	height: 100%;
	margin-top: 0;
	margin-bottom: 0;
}
/* columns of same height styles */
.row-height {
	display: table;
	table-layout: fixed;
	height: 100%;
	width: 100%;
}
.col-height {
	display: table-cell;
	float: none;
	height: 100%;
}
.col-top {
	vertical-align: top;
}
.col-middle {
	vertical-align: middle;
}
.col-bottom {
	vertical-align: bottom;
}

@media (min-width: 480px) {
.row-xs-height {
	display: table;
	table-layout: fixed;
	height: 100%;
	width: 100%;
}
.col-xs-height {
	display: table-cell;
	float: none;
	height: 100%;
}
.col-xs-top {
	vertical-align: top;
}
.col-xs-middle {
	vertical-align: middle;
}
.col-xs-bottom {
	vertical-align: bottom;
}
}

@media (min-width: 768px) {
.row-sm-height {
	display: table;
	table-layout: fixed;
	height: 100%;
	width: 100%;
}
.col-sm-height {
	display: table-cell;
	float: none;
	height: 100%;
}
.col-sm-top {
	vertical-align: top;
}
.col-sm-middle {
	vertical-align: middle;
}
.col-sm-bottom {
	vertical-align: bottom;
}
}

@media (min-width: 992px) {
.row-md-height {
	display: table;
	table-layout: fixed;
	height: 100%;
	width: 100%;
}
.col-md-height {
	display: table-cell;
	float: none;
	height: 100%;
}
.col-md-top {
	vertical-align: top;
}
.col-md-middle {
	vertical-align: middle;
}
.col-md-bottom {
	vertical-align: bottom;
}
}

@media (min-width: 1200px) {
.row-lg-height {
	display: table;
	table-layout: fixed;
	height: 100%;
	width: 100%;
}
.col-lg-height {
	display: table-cell;
	float: none;
	height: 100%;
}
.col-lg-top {
	vertical-align: top;
}
.col-lg-middle {
	vertical-align: middle;
}
.col-lg-bottom {
	vertical-align: bottom;
}
}
/* Social Buttons : hover in the correct colors
<ul class="nav navbar-nav navbar-right social">
	<li><a href="#"><i class="fa fa-lg fa-facebook"></i></a></li>
	<li><a href="#"><i class="fa fa-lg fa-twitter"></i></a></li>
	<li><a href="#"><i class="fa fa-lg fa-google-plus"></i></a></li>
	<li><a href="#"><i class="fa fa-lg fa-linkedin"></i></a></li>
</ul>
*/

.social .fa-facebook-square:hover, .social .fa-facebook:hover, .social > a:hover {
	color: #3B5998;
}
.social .fa-twitter-square:hover, .social .fa-twitter:hover {
	color: #00ABE3;
}
.social .fa-google-plus:hover, .social .fa-google-plus-square:hover {
	color: #e64522;
}
.social .fa-linkedin:hover, .social .fa-linkedin-square:hover {
	color: #0094BC;
}
/* centered columns styles
see http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-centered-columns

<div class="container">
    <div class="row row-centered">
        <div class="col-xs-6 col-centered"></div>
        <div class="col-xs-6 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
    </div>
</div>

*/
.row-centered {
	text-align: center;
}
.col-centered {
	display: inline-block;
	float: none;
	/* reset the text-align */
    /*text-align:left;
    /* inline-block space fix */
	margin-right: -4px;
}
/* REDEFINE FOR BOOTSTRAP*/

/* = CALENDAR ======================================== */

.calendar {
	/*xxborder-radius: 5px;*/
}
.calendarmini {
	border: none !important;
	background-color: transparent !important;
	border-collapse: inherit !important;
}
.calendarMonth {
	background-color: transparent !important;
	border: none !important;
	/*border-radius: 5px;*/
	font-size: 14px;
}
.calendarDayHeader {
	background-color: #CCC;
	/*borde-radius: 5px;*/
}
.calendarday1 {
	background-color: #FFFFFF;
	padding: 2px; /* border-color: #C6E2FF; border:solid 1px; */
}
.calendarday0 {
	background-color: #F3F3F3;
	padding: 2px; /*border-color: #C6E2FF; border:solid 1px; */
}
.calendarLink {
	background-color: #D23232;
	/*-borderradius: 5px;*/
}
.calendarLink a.info:hover, .calendarLink:hover {
	background-color: #FF0000 !important;
}
.calendarToday, .calendarThisMonth {
	/*border-radius: 5px;*/
}
.calendarSelected {
	padding: 2px;
	background-color: #BBB;
	color: #FFF;
}