﻿/****************** VISUALS *********************/

.inline-title {
	display:inline;
}

.navbar {
	border-radius:0px;
	border-width:0px;
	/*background-color:#428bca;*/
	margin-bottom:0px;
}


.navbar-inverse .navbar-brand {
	color:#FFFFFF;
}

.navbar-inverse .navbar-nav li a {
	color:#FFFFFF;
}

.navbar-right .glyphicon {
	margin:0px;
	margin-top:-3px;
	font-size:28px;
	color:#FFFFFF;
}

.navbar-left-button {
	border-right:1px #5D5D5D solid;
	margin-right:12px;
}
.navbar-right-button {
	border-right:1px #5D5D5D solid;
}

.navbar-right .glyphicon-log-in, .navbar-right .glyphicon-log-out, .navbar-right .glyphicon-calendar {
	font-size:14px;
}

.navbar-inverse a:hover {
	color:#888888 !important;
}
.navbar-inverse a:hover span {
	color:#888888 !important;
}

.navbar .dropdown-menu * {
	color:#262626 !important;
}

.navbar .back-navigator .glyphicon {
	font-size:12pt;
}

.navbar #navbar-back-navigator {
	border-right:1px #5D5D5D solid;
	height:50px;
}

.navbar .back-navigator {
	font-size:12pt;
	padding:6px;
	margin-top:8px;
	margin-right:8px;
	padding-right:18px;
}

.navbar .back-navigator:hover {
	background-color:#449D44 !important;
	color:white !important;
}
.navbar .back-navigator:hover span {
	color:white !important;
}
.navbar .back-navigator .close {
	position:absolute;
	top:-3px;
	right:1px;
	font-size:18px;
	/*
	margin-top:-6px;
	margin-right:-2px;
	font-size:18px;
	padding:0;
	margin-left:4px;
	float:right;
	*/
}

.logo_bg {
	/*background-color:#27ae60; GREEN */
	/* background-color:#FF7E47; RED */
	
	/* background-color:rgb(47,164,231); */ /* LIGHT BLUE */
	/* background-color:#F5F5F5; */ /* LIGHT GRAY */
	
	/* background:url(../images/parallax-test.jpg) no-repeat left top fixed; THIS IS RANDOMIZED IN JAVASCRIPT */
	
	/*
	transition: background-color 1s ease-in-out;
	background-color:rgb(0,0,0,0);
	*/
	
	width:100%;
}

/* For any viewports less than 1000px wide */
@media (max-width: 1650px) {

    .logo_bg {
        background-size: 1920px 1080px; /* Force the image to its minimum width */
    }

}

.parallax {
	background: no-repeat left top fixed;
	background-size: cover;
	width:100%;
	height:1000px; 
}

.logo_bg .container {
	padding-top:24px;
	padding-bottom:24px;
}

.frontpage-cloud {
	padding-top:60px;
	width:265.5px;
	height:150.5px;
	max-width:265.5px;
	max-height:150.5px;
	background-image:url(../images/frontpage/cloud_blue.png);
	background-size:cover;
	background-repeat:no-repeat;
	color:#FFFFFF;
}

.frontpage-cloud:hover {
	background-image:url(../images/frontpage/cloud_light_blue.png);
}

.frontpage-price {
	color:#FFFFFF;
	background-color:#4FABE4;
}

.frontpage-price a {
	color:#FFFFFF;
	text-decoration:underline;
}

.frontpage-collapses {
	padding-top:32px;
	margin-left:0px;
	/*position:relative;*/
}

.arrow-up {
	position:absolute;
	width: 0; 
	height: 0; 
	border-left: 32px solid transparent;
	border-right: 32px solid transparent;
	
	border-bottom: 16px solid rgb(215, 126, 27);

	top:-16px;
	left:0px;
}

.frontpage-collapses .panel-collapse {
	background-color:rgba(100,100,0,0.2);
	box-shadow:3px 3px 6px rgba(0,0,0,0.4) !important;
	position:relative;
}

.frontpage-collapses .panel-collapse .panel-body {
	/*position:relative;*/
}


@font-face {
	font-family:"FielDoFont";
	src:url('../fonts/Raleway-VariableFont_wght.ttf');
}

body * {
	font-family:"FielDoFont";
}

/*.yellowbg {*/
body {
	/*background-color:#FFD247;*/ /* GOLD */
	/* background-color:#777777; */ /* GRAY */
	
	background-color:#DDDDDD; /* LIGHT GRAY */
}

.search_results_bg {
	background-color:#DDDDDD;
    transition: height 0.4s ease;
	border-color:#FFFFFF;
	border-width:8px;
	box-shadow: inset 0px 0px 12px #888, inset 0px 0px 12px #888;
}

.search_results_bg table {
	margin-bottom:0px;
}

.search_results_bg td {
	border-top:none !important;
}

.search_results_bg a {
	color:#000000;
}

.search_results_bg .table .odd {
	background-color:rgba(0,0,0,0.06); /* DARK SHADE */
	/* background-color:rgba(255,255,255,0.4); */ /* BRIGHT SHADE */
}

.search_results_bg .table .even { }

.table.noborders tr td {border:none;}

.suggested_searches_bg {
	width:100%;
	/* background-color:#F5F5F5; */
	padding-bottom:24px;
	padding-top:24px;
}

.suggested_searches_bg img {
	max-width:180px;
}

.suggested_searches_bg .row {
	padding-bottom: 12px;
	padding-top: 12px;
}

.suggested_searches_bg .thumbnail:hover {
	border-color:#3c763d;
}
.suggested_searches_bg .thumbnail:hover > .caption {
	background-color:#3c763d;
}

.suggested_searches_bg .caption {
	transition: background-color 0.4s ease;
	background-color:#dff0d8;
}

.navbar-right a:hover .glyphicon, .navbar-right .active .glyphicon {
	color:#FFFFFF;
}

small {
	font-size:11px;
	font-style:italic;
}

.custom_container_look {
	border:1px solid #D5D5D5;
	border-radius:6px;
	padding:8px;
	margin-bottom:12px;
}
.custom_container_look.noradius {
	border-radius:0;
}

.highlight {
	background-color:#dff0d8;
}

.highlight:hover td {
	background-color:#f2dede !important;
}

#book_new_start_selection td:hover {
	background-color:#f5f5f5;
}

/*********************** PANEL SIZES *************************/

.panel-thin {
	margin-left:20%;
	width:60%;
	min-width:292px;
}

@media (max-width:768px) {
	.panel-thin {
		margin-left:4px;
		width:99%;
	}
}

.panel-wide {
	margin-left:10%;
	max-width:80%;
	width:80%;
}


/*********************** OTHER *************************/

.error {
	border-color:red;
	border-style:solid;
	border-width:1px;
	border-radius:4px;
}

.wrapper {
	height:650px;
}

.glyphicon-large {
	font-size:18px;
}

.glyphicon-huge {
	font-size:22px;
}

.types-edit {
	display:none;
}
.resources-edit {
	display:none;
}

.glyphicon-margin {
	margin-top:4px;
}
.glyphicon-margin2 {
	margin-top:-2px;
}

.linkpointer {
	cursor:pointer;
}

.tooltip-left .tooltip .tooltip-inner {
	text-align:left !important;
}

.tooltip-left .tooltip .tooltip-inner ul {
	padding-left:12px;
}

.max1920 {
	max-width:1920px;
}

.max1650 {
	max-width:1650px;
}

.max1200 {
	max-width:1200px;
}

.max600 {
	max-width:600px;
}

.navbar-embed {
	margin-right:8px;
	position:relative;
	z-index:99999999;
}

.navbar-embed-extrapadding {
	margin-right:12px;
	margin-top:12px;
}

.navbar-embed a, .navbar-embed a:active, .navbar-embed a:visited {
	color:#000000;
	text-decoration:none;
}

.navbar-embed a:hover {
	color:#777;
	text-decoration:none;
}

.panel-documentation {
	margin-left:20%;
	width:60%;
	min-width:292px;
}


@media (max-width:991px) {
	.panel-documentation {
		margin-left:0;
		width:100%;
	}
}

.footer {
	width:100%;
	height:50px;
	margin-top:24px;
	background-color:#222;
	color:#777;
}


.centervertical {
	height:50px;
	display: flex;
    text-align: center;
	justify-content: center;
	align-items: center;
}

.footer a {
	color:#FFFFFF;
}

.footer a:hover, a:focus{
	color:#888888;
	text-decoration:none;
}

.last-form-group {
	margin-bottom:0px;
}

table.collapse.in {
    display: table;
}

.customer_records_comment_textarea {
	width:70px;
}

.customer_records_comment_textarea_larger {
	width:140px;
}

.timedo-login-button {
	border:1px solid #ddd;
	border-radius:4px;
	padding:4px;
	background-color:#f5f5f5;
	padding:14px 16px 14px 8px;
	color:#000000;
}

.timedo-login-button:hover {
	text-decoration:none;
	color:#000000;
}

/*********************** INDEX BODY THINGS / BOOK NEW FORM / ETC *************************/

.index-body-container {
	padding:24px;
	height:472px;
	width:100%;
	display:table;
}

.schedule-container {
	display:table-cell;
	width:100%;
	transition: width 0.2s ease;
}

.book-new-container-cell {
	display:table-cell;
	width:50px;
	min-width:50px;
	vertical-align:top;

	transition: width 0.2s ease, min-width 0.2s ease;
}

.book-new-container {
	display:none;
	background-color:#FFFFFF;
	margin-top:2px;
	width:380px;
	padding:8px;
	padding-right:46px;
	box-shadow:3px 3px 6px rgba(0,0,0,0.4) !important;
}

.book-new-expander {
	position:absolute;
	width:470px;

	top:50px;
	left:58px;

	box-shadow:3px -3px 6px rgba(0,0,0,0.4) !important;
	
	transform: rotate(90deg);
	transform-origin: top left;

	transition: left 0.2s ease;
}

.book-new-expander .panel-heading {
	background-color:#5cb85c !important;
}

.book-new-expander.book-new-expander-error .panel-heading {
	background-color:#c9302c !important;
}

.alert-in-btn {
	float:none;
	display:inline-block;
	margin:0;
	margin-top:4px;
	padding:4px 8px 4px 8px;
}

/*********************** MULTI FORM CONTROL INPUT GROUP *************************/
/* CREDITS: https://github.com/twbs/bootstrap/issues/12732 */

.input-group-field {
    display: table-cell;
    vertical-align: middle;
    border-radius:4px;
    min-width:1%;
    white-space: nowrap;
}
.input-group-field .form-control {
    border-radius: inherit !important;
}
.input-group-field:not(:first-child):not(:last-child) {
    border-radius:0;
}
.input-group-field:not(:first-child):not(:last-child) .form-control {
    border-left-width: 0;
    border-right-width: 0;
}
.input-group-field:last-child {
    border-top-left-radius:0;
    border-bottom-left-radius:0;
}

.raise-sups sup {
	top:-1.5em;
}

/*********************** SCHEDULE *************************/
.schedule-panel {
	min-width:535px;
}

.schedule-element {
	margin-left:1px;
	margin-right:1px;

	padding-top:2px;
	padding-bottom:2px;
	padding-left:1px;
	padding-right:1px;

	text-align:center;

	height:100%;
	width:100%;

	font-size:12px;
	text-overflow:ellipsis;
	overflow:hidden;
	line-height:12px;

	border-radius:2px;
	box-shadow:1px 1px 2px rgba(0,0,0,0.4);
}

.week-view-table thead tr th, .day-view-table thead tr th {
	padding:0px;
	text-align:center;
}

.week-view-table tbody td:nth-child(1), .day-view-table tbody td:nth-child(1) {
	text-align:center;
	padding-top:0px;
	height:40px;
}

.agenda-header {
	margin-left:32px;
	margin-right:32px;
	margin-top:8px;

	border-style:solid;
	border-width:1px;
	border-top-left-radius:4px;
	border-top-right-radius:4px;
	border-color:#DDDDDD;

	min-height:87px;
}

.agenda-header .agenda-header-date {
	float:left;
	padding-left:40px;
	padding-right:40px;
	padding-bottom:10px;
	border-left:4px;
	text-align:center;
	border-top-left-radius:4px;
	background-color:#EEEEEE;
}

.agenda-header-date h1 {
	font-size:30px;
	padding-bottom:0px;
	padding-top:0px;
	margin-top:12px;
	margin-bottom:4px;
}
.agenda-header-date h2 {
	font-size:20px;
	padding-bottom:0px;
	padding-top:0px;
	margin-top:4px;
	margin-bottom:4px;
}
.agenda-header-body {
	margin-top:12px;
	margin-left:170px;
}

.agenda-item {
	margin-top:-1px;
	margin-left:32px;
	margin-right:32px;
	padding-left:20px;
	padding-right:20px;
	padding-top:8px;
	padding-bottom:8px;
	border-style:solid;
	border-width:1px;
	border-color:#DDDDDD;
}
.agenda-item-last {
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
}
.agenda-item-time {
	float:right;
}

.schedule-result-date {
	font-size:22px;
}

.month-view-row {
	height:80px;
}

.month-view-column {
	width:80px;
	position:relative;
}

.month-table thead th {
	text-align:center;
}

.bg-muted {
	background-color:#EEEEEE;
}

.month-table tbody tr {
	transition: background-color 0.2s ease;

}

.month-table tbody tr:hover {
	background-color:#d9edf7;
}

.month-view-count {
	position:absolute;
	bottom:4px;
	right:4px;
	border-style:solid;
	border-width:1px;
	border-color:#BBBBBB;
	border-radius:4px;
	padding:1px 6px 1px 6px;
	background-color:#EEEEEE;
}

.week-view-hover-indicator {
	width:20px;
	height:16px;

	text-align:center;

	font-size:12px;
	text-overflow:ellipsis;
	overflow:hidden;
	line-height:12px;

	border-radius:2px;
	box-shadow:1px 1px 2px rgba(0,0,0,0.4);
	background-color:#EEEEEE;

	/*
	transition:left 0.05s ease, top 0.05s ease;
	*/

	z-index:100;
	cursor:pointer;	
}

.rotate90deg {
	transform: rotate(90deg);
	transform-origin: center center 0;
}

.vacation-days-margin {
	position:absolute;
	text-align:center;
	vertical-align:middle;
}

.text-muted-double {
	color:#CCC;
}

.vacation-days-description-inner {
	word-wrap:break-word;
	display:inline-block;
	height:100%;
	padding-top:20px;
	font-size:24px;
}

.scheduler .tab-button a {
	color:#000000;
}

.scheduler .bg-danger {
	/*background-color:#f2dede;*/
	background-color:#cc7f7f;
}

.scheduler .bg-success {
	/*background-color:#dff0d8;*/
	background-color:#95cd7e;
}

.scheduler .text-muted-double {
	color:white;
}

.text-align-right {
	text-align:right;
}

.modal-dialog-wide {
	width:auto;
	max-width:800px;
}

#interest-modal-dialog {
	transition:width 0.2s ease;
	width:900px;
	max-width:calc(100% - 30px);
}

#interest-modal-dialog.prices-shown {
	width:1200px;
}

@media (max-width: 991px) {
	#interest-modal-dialog {
		width:738px !important;
	}

	#interest-modal-prices {
		background-color:white;
		border-radius:8px;
		z-index:999;
		margin-right:16px;
	}
}


/*********************** MULTISELECT *************************/

.multiselect {
	width:100%;
	position:relative;
	text-align:left;
}
.multiselect-checkboxes {
	position:absolute;
	z-index:9999;
	background:white;
	border:1px #ccc solid;
	border-top:none;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
	width:100%;
	max-height:400px;
	overflow-y:scroll;
}
.multiselect-checkbox {
	padding-left:16px;
	padding-right:16px;
	padding-top:4px;
	padding-bottom:4px;
	cursor:pointer;
}
.multiselect-checkbox:hover {
	background-color:rgba(0,0,0,0.1);
}
.multiselect-checkbox:not(:last-child) {
	border-bottom:1px #ccc solid;
}
.multiselect-checkbox input {
	margin-right:6px;
	padding-right:4px;
	border-right:1px #ccc solid;
	pointer-events:none;
}

.dot {
	display:inline-block;
	margin:0;
	line-height:1;
	border-radius:1em;
	width:1em;
	height:1em;
	transform:translateY(2px);
	border:1px solid black;
}

.dot-small {
	display:inline-block;
	margin:0;
	margin-right:1px;
	margin-bottom:1px;
	border-radius:0.8em;
	width:0.8em;
	height:0.8em;
	pointer-events:auto;
	border:1px solid black;
}
.dot-smaller {
	display:inline-block;
	margin:0;
	margin-right:1px;
	margin-bottom:1px;
	border-radius:0.4em;
	width:0.4em;
	height:0.4em;
	pointer-events:auto;
	border:1px solid black;
}

.well {position:relative;}
#company_panel .panel-body .well {
	border-radius:0;
	padding-top:30px;
}

#company_panel .panel-body .well label {
	font-weight:500;
}

.well-title {
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 4px;
	padding-bottom: 4px;
	border-radius: 2px;
	border: 1px solid #e3e3e3;
	position: absolute;
	top: -12px;
	background-color:#f5f5f5;
	display: inline-block;
	font-weight: 700;
}

/* bootstrap datetimepicker fixes */
.datepicker-decades .decade {
	width:108px;
	height:auto;
	vertical-align:top;
}