/*
Theme Name: Vexter CRM
Description: Custom styles for Vexter CRM
Version: 1.0
Author: Brian Pohl
Author URI: http://www.invexdesign.com
*/

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

html, body, div, p, h1, h2, h3, img { margin:0; padding:0; }
a img { border:none; }
table, table td, table th { border-collapse:collapse; }
map, area { border:none; }

h1, h2, h3, h4, strong {
	font-weight:700;	
}
a:link, a:visited { text-decoration:none; }
a:hover, a:active { text-decoration:underline; }

/* ----- Floats ----- */
.alignright { float:right; margin:0 0 10px 25px; padding:0; }
.alignleft { float:left; margin:0 25px 10px 0; padding:0; }
.aligncenter { text-align:center; }

body {
	font-family: 'Open Sans', sans-serif;
	font-weight:400;
	color:#333;
	font-size:13px;
	background:#FFF;
}
body.login-wrap {
	background:#FFF;	
}

/* ----- Login Page ----- */
.login {
	width:384px;
	margin:69px auto 0 auto;
	padding:63px 100px 50px 100px;
	background:#FFF;
	-moz-box-shadow: 0 0 3px 3px #BBB;
	-webkit-box-shadow: 0 0 3px 3px #BBB;
	box-shadow: 0 0 3px 3px #BBB;
}
.login img {
	margin:0 0 15px 0;	
}
.login form {
	margin:0;
	padding:0;	
}
.login label {
	color:#767676;
	font-size:18px;
	line-height:24px;
	font-weight:300;
	display:block;
	margin:0 0 5px 0;
	padding:0;
}
.login input.txt {
	color:#333;
	font-size:16px;
	line-height:23px;
	font-weight:400;
	display:block;
	margin:0 0 5px 0;
	padding:10px;
	border:2px solid #767676;
	background:#F3F3F3;
	width:364px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
}
.login input.icon {
	padding-left:40px;
	width:334px;
	background-repeat:no-repeat;
	background-position:5px 7px;
}
.login input.user {
	background-image:url(images/icons/user.png);
}
.login input.lock {
	background-image:url(images/icons/lock.png);
}
.login input.btn {
	color:#FFF;
	font-size:13px;
	line-height:19px;
	font-weight:800;
	display:block;
	padding:5px 25px;
	text-transform:uppercase;
	border:1px solid #669ef9;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	background:#669ef9;
	cursor:pointer;
	float:right;
	text-align:center;
}
.login input.btn:hover {
	background:#4b8df8;
	border-color:#4b8df8;
}
.login table {
	width:384px;
	margin:20px 0;	
}
.login p {
	font-size:14px;
	font-weight:300;
	text-align:center;
	width:100%;
	padding:0;
	margin:35px auto 0px auto;	
}
.login p a:link, .login p a:visited {
	color:#551A8B;
	font-weight:700;
}
.login p a:hover, .login p a:active {
	opacity:1.0;
	font-weight:700;
}
.login-copyright {
	width:384px;
	margin:25px auto;
	text-align:center;
	display:block;
	color:#A9A9A9;
	font-size:12px;
	text-align:center;
}

/* ----- Header ----- */
#header {
	width:100%;
	position:fixed;
	min-height:61px;
	height:61px;
	top:0px;
	background:#333;
	text-align:center;	
	z-index:9999;
}
#header img.logo {
	position:absolute;
	left:7px;
	top:4px;
}
#header h1 {
	color:#FFF;
	font-weight:800;
	font-size:24px;
	line-height:32px;
	text-align:center;
	padding:14px 0;
	display:inline-block;
}
#header h1 select {
	height:14px;
	font-size:9px;
	line-height:14px;
	padding:0 0 0 5px;
	/* width:85px; */
	font-weight:300;
	color:#333;
	background:#A7A7A7;
	border:1px solid #A7A7A7;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	position:relative;
	top:0px;
}
#header span.user {
	text-align:right;
	display:block;
	position:absolute;
	top:25px;
	right:35px;
	font-size:12px;
	line-height:16px;
	height:16px;
	color:#A7A7A7;
	padding-left:24px;
	background:url(images/icons/key-dropdown.png) no-repeat top left;
}
#header span.user a.drop-down:link, #header span.user a.drop-down:visited {
	color:#FFF;
	display:inline-block;
	padding-right:14px;
	background-image:url(images/icons/user-dropdown.png);
	background-repeat:no-repeat;
	background-position:right 5px;
}
#header span.user a.drop-down:hover, #header span.user a.drop-down:active {
	
}
#header span.user ul {
	position:absolute;
	bottom:0px;
	right:0px;
	display:none;
}

/* ----- Sidebar ----- */
#sidebar {
	position:fixed;
	top:61px;
	width:215px;
	height:	100%;
	background:#767676;
}
#sidebar ul {
	margin:0;
	padding:0;
	list-style:none;	
}
#sidebar ul li {
	margin:0;
	padding:0;
	border-bottom:1px solid #989898;
}
#sidebar ul li a:link, #sidebar ul li a:visited {
	display:block;
	padding:10px 10px 10px 55px;
	font-size:13px;
	font-weight:400;
	line-height:23px;
	color:#FFF;
	background-repeat:no-repeat;
	background-position:top left;
}
#sidebar ul li a:hover, #sidebar ul li a:active {
	text-decoration:none;
	background-color:#989898;
}

#sidebar .list-group-item {
    padding: 1px;
}
#sidebar .icon {
    display: inline-block;
    width: 45px;
    height: 35px;
}
#sidebar .dashboard {
	background-image:url(images/icons/dashboard-nav.png);	
}
#sidebar .patients {
	background-image:url(images/icons/patients-nav.png);	
}
#sidebar .schedule {
	background-image:url(images/icons/schedule-nav.png);	
}
#sidebar .tickets {
	background-image:url(images/icons/tickets-nav.png);	
}
#sidebar .payments {
	background-image:url(images/icons/payments-nav.png);	
}
#sidebar .analytics {
	background-image:url(images/icons/analytics-nav.png);	
}
#sidebar .settings {
	background-image:url(images/icons/settings-nav.png);	
}
#sidebar ul li a.current {
	background-color:#5c84c4;
	cursor:default;	
}

/* ----- Loader ----- */
div.loader .message-container .loading-message {
    line-height: 25px;
}

div.loader .message-container {
    text-align: center;
    color: white;
    margin: 0 20px;
}

div.loader {
    position: fixed;
    height: 250px;
    width: 300px;
    padding-top: 150px;
    left: 40%;
    top: 35%;
    z-index: 100;
    border-radius: 50px;
    box-shadow: 5px 7px 10px #888888;
    background: url(gifs/skype-balls-loader-white-fast-bg-337AB7.GIF) 50% 30% no-repeat #337AB7;
    display: none;
}

/* ----- Content ----- */
#content {
	margin:61px 0 40px 225px;
	padding:30px;	
}
#content h2 {
	color:#333;
	font-size:32px;
	line-height:42px;
	font-weight:300;
	margin:0 0 25px 0;
	padding:0;	
}
#content h3 {
	color:#333;
	font-size:18px;
	line-height:42px;
	font-weight:700;
	margin:0 0 25px 0;
	padding:0;	
}
#content h3 {
	color:#333;
	font-size:18px;
	line-height:42px;
	font-weight:700;
	margin:0 0 25px 0;
	padding:0;	
}
#content h3 {
	color:#333;
	font-size:20px;
	line-height:28px;
	font-weight:400;
	margin:0 0 20px 0;
	padding:0;	
}
#content h4 {
	color:#333;
	font-size:15px;
	line-height:29px;
	font-weight:600;
	margin:0 0 20px 0;
	padding:0;	
}
#content h5 {
	color:#333;
	font-size:13px;
	line-height:1.6;
	font-weight:800;
	margin:0 0 10px 0;
	padding:0;
}
#content p {
	margin:0 0 20px 0;
	padding:0;
	font-size:13px;
	line-height:1.6;	
}
#content ul, #content ol {
	margin:0 0 20px 20px;
	padding:0 0 0 10px;
}
#content ul {
	list-style:disc;	
}
#content ol {
	list-style:decimal;
}
#content li {
	margin:0 0 5px 0;
	padding:0;
	font-size:13px;
	line-height:1.6;	
}
#content div.form-group a.btn {
    color:white;
}
#content a {
	color:#4b8df8;
	font-weight:600;	
}
#content table {
	margin:0 0 20px 0;
	padding:0;	
}
#content td, #content th {
	text-align:left;
	padding:10px;
	font-size:12px;	
	font-weight:400;
	border:1px solid #CCC;
}
#content th {
	font-size:13px;
	font-weight:700;
	color:#FFF;
	border-color:#4b8df8;
	background:#4b8df8;	
}

/* ----- Footer ----- */
#footer {
	width:100%;
	position:fixed;
	height:40px;
	min-height:40px;
	bottom:0px;
	background:#333;
	z-index:9999;
	font-size:12px;
	color:#666666;
}
#footer .copyright {
	position:absolute;
	left:18px;
	top:12px;
}
#footer .ver {
	position:absolute;
	right:18px;
	top:12px;
	color:#999	
}

#breadcrumbs ul.breadcrumb{
    margin:0;
}

#content ul.pagination {
    margin:0;
}

#sidebar div.collapse.children-have-top-margin a {
    margin-top:10px;
}

div.block div table td {
    border: 0 !important;
}

div.block thead tr {
    border-bottom: 1px solid black;
}

div.block thead td {
    font-weight: bold !important;
}

.block {
    border: 1px solid #4b8df8;
    display: inline-block;
}

.block_header {
    border-color: #4b8df8;
    background: #4b8df8;
    font-size: 18px;
    color: white;
    padding: 5px 0;
}

.block_header_text {
    margin-left: 15px;
    height: 37px;
    vertical-align: bottom;
}

.w18 {
    width: 18%;
}

.w80 {
    width: 80%;
}

.w100 {
    width: 100%;
}

.h300 {
    height: 300px;
}

.icon {
    width: 40px;
    height: 37px;
    display: inline-block;
}

.icon-payments {
    background: url(/assets/images/icons/payments-nav.png) no-repeat;
}

.icon-tickets {
    background-image: url(/assets/images/icons/tickets-nav.png);
}

.icon-schedule {
    background-image: url(/assets/images/icons/schedule-nav.png);
}

.icon-patients {
    background-image: url(/assets/images/icons/patients-nav.png);
}

.clear {
    clear: both;;
}

.feeds {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.feeds li {
    margin: 0 !important;
    padding: 0 !important;
}

.feeds .col1 {
    display: inline-block;
    width: 49%;
}

.feeds .col2 {
    display: inline-block;
    width: 49%;
    text-align: right;
}

.col1 .desc {
    margin-left: 5px !important;
}

.inherit-background {
    background-color: inherit !important;
}

#sidebar .list-group a {
    background-color: inherit;
    color: inherit;
    border: 0;
}

.content-container {
	margin: 10px;
}
.message {
	color: green;
}
.errorMessage {
	color: red;
}

/*
These classes determine the display of calendar events.
NOTE: They must follow the form "appointment-action-" + ACTION_TYPE->NAME
 */
#calendar .appointment-action-cancelled, .appointment-action-cancelled {
	background-color:red;
	border:1px solid red;
	color:white;
}
#calendar .appointment-action-confirmed, .appointment-action-confirmed {
	background-color:green;
	border:1px solid green;
	color:white;
}
#calendar .appointment-action-noshow, .appointment-action-noshow  {
	background-color:#663300;
	border:1px solid #663300;
	color:white;
}
#calendar .appointment-action-checkedin, .appointment-action-checkedin  {
	background-color:#3a87ad;
	border:1px solid #3a87ad;
	color:white;
}
#calendar .appointment-action-voicemail, .appointment-action-voicemail  {
	background-color:purple;
	border:1px solid purple;
	color:white;
}
#calendar .appointment-action-rescheduled, .appointment-action-rescheduled  {
	background-color:yellow;
	border:1px solid yellow;
	color:black;
}
#calendar .appointment-action-nosale, .appointment-action-nosale  {
	background-color:gray;
	border:1px solid gray;
	color:white;
}
#calendar .appointment-action-none, .appointment-action-none  {
	background-color:black;
	border:1px solid black;
	color:white;
}
#calendar .appointment-has-ticket, .appointment-has-ticket  {
    border: 2px dashed;
}

#content ul#appointment_color_key {
	margin: 10px;
	padding: 0;
}

/*
These classes determine the display of the actions listed in the appointment single page.
NOTE: They must follow the form "appointment-action-" + ACTION_TYPE->NAME
.appointment-action-cancelled {
	background-color:orange;
	border:1px solid orange;
	color:white;
}
.appointment-action-confirmed {
	background-color:green;
	border:1px solid green;
	color:white;
}
.appointment-action-noshow {
	background-color:red;
	border:1px solid red;
	color:white;
}
.appointment-action-checkedin {
	background-color:#3a87ad;
	border:1px solid #3a87ad;
	color:white;
}
.appointment-action-voicemail {
	background-color:purple;
	border:1px solid purple;
	color:white;
}
.appointment-action-rescheduled {
	background-color:yellow;
	border:1px solid yellow;
	color:black;
}
.appointment-action-nosale {
	background-color:gray;
	border:1px solid gray;
	color:white;
}
 */
 
 .dataTables_wrapper {
    position: relative;
    clear: both;
    zoom: 1;
    overflow-x: scroll;
   
}
div#DataTables_Table_0_wrapper {
    overflow-x: scroll;
}