/* --------------------------------------------------------------------------------------------------------------------------------------------------
RESET & HTML ELEMENTS
-------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen {
}
@media print {
	.dontprint { display: none; }
	.portlet-tab-nav { display: none; }
}
body {
	background-color:#FFF; 
	font:0.8em/1.5 SofiaProLightRegular,Arial,Helvetica,sans-serif;
	margin: 0px;
}


@media only screen and (max-width:400px) {
   body { font-size: 1em; }
}

h1, h2, h3, h4, h5, h6 {
    color: #111111;
    margin-bottom: 0.75em;
}
h1 {
    font-size: 30px;
    line-height: 1em;
}
h2 {
    color: #222222;
    font-size: 24px;
    font-weight: normal;
    margin-bottom: 1em;
}
h3 {
    color: #333333;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 0.75em;
}
h4 {
    color: #666666;
    font-size: 14px;
    line-height: 1.25;
    margin-bottom: 1.25em;
}
h5 {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 1.5em;
}
h6 {
    font-size: 11px;
    font-weight: bold;
}

.h-disabled {
    color:#c0c0c0;
}

p.big-text 
{
	font-size: 16px;
}

/*table.table {border-collapse:collapse; border-spacing:0;}*/

a {color:#004B96;}
a:hover, a:active, a:focus {color:#0065C8;}

.fake-link { color:#004B96; text-decoration:underline; cursor:pointer; }
.fake-link:hover, .fake-link:active, .fake-link:focus {color:#0065C8;}

.fake-link-white { color: white; text-decoration: underline; cursor: pointer; }
.fake-link-white:hover, .fake-link-white:active, .fake-link-white:focus { color: white; }

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

/* The emerging W3C standard that is currently Firefox-only */
* {
    scrollbar-width: thin;
    scrollbar-color: #263849 #ddd;
}

/* Works on Chrome/Edge/Safari */
*::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

*::-webkit-scrollbar-track {
    background: #ddd;
}

*::-webkit-scrollbar-thumb {
    background-color: #263849;
    border-radius: 20px;
    border: 2px solid #ddd;
}
    
/* --------------------------------------------------------------------------------------------------------------------------------------------------
LAYOUT
-------------------------------------------------------------------------------------------------------------------------------------------------- */

body {
    overflow-y: hidden;
    height: 100vh;
}

#section {
    overflow: hidden;
    width: 100%;
    height: calc(100vh - 96px);
}

@media (max-width: 1235px) {
    #section { height: calc(100vh - 152px); }
}

@media print {
    body {
        overflow-y: initial;
        height: initial;
    }

    #section {
        height: initial;
    }
}

#aside {
    float: left;
    width: 200px;
    padding: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
    position: relative;
}

#mainpanel {
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-panel-container {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

#content-panel {
    height: 100%;
}

#overlay-panel {
    height: 100%;
}

#content {
/*    padding-bottom: 100px;*/
    margin: 0 0 0 0;
    position: relative;
}

.fixed-scrolling-content {
    padding-bottom: 0px;
    height: 100%;
}

#content.fixed-scrolling-content {
    padding-bottom: 0px;
    height: 100%;
}

.fixed-scrolling-content .portlet {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.fixed-scrolling-content .portlet-content {
    height: calc(100% - 60px);
}

.sticky-thead tr th {
    position:sticky;
    top:0;
    z-index:2000;
}

/*
	HEADER NAV
*/
#header { background-color: #0069CB; margin:0; padding:5px; overflow:hidden; height: 56px; }

@media (max-width: 1235px) {

    #header { height: 112px; }
}

#header #nav { list-style:none; font-size:110%; float:right; margin-bottom:0; }
#header #nav li {display:inline;}
    #header #nav li a {
        display: block;
        float: left;
        padding: 6px 12px;
        font-weight: bold;
        text-decoration: none;
        color: white;
        border-bottom: 3px solid #0069cb;
    }
#header #nav li.current a {text-decoration:none;}
#header #logo {color:#FFF;}
#header #nav li a 
{
	color:#FFF;
	text-decoration: none;
}
#header #nav li a:hover 
{
	border-bottom: 3px solid #f0f0f0;
}
#header #nav li.current a 
{
	background-color:#FFF; 
	color:#0069CB;
}

#strip { background-color:#f0f0f0; margin:0; padding:2px; overflow:hidden; border-top: 1px solid black; border-bottom: 1px solid black; height:24px; }

	.articles .article-info {border-bottom:1px dotted #CCC; color:#888;}
	.articles .article-info a {color:#888;}
	.articles .article-info a:hover {color:#555;}
	.pagination a.current {background-color:#0069CB; color:#FFF;}
	.more a {border:1px solid #DDD; border-right:1px solid #CCC; border-bottom:1px solid #CCC; background-color:#EEE; color:#000;}
	.more a:hover {background-color:#FFF; color:#004B96;}
	.menu {border-top:1px dotted #CCC;}
	.menu li a {border-bottom:1px dotted #CCC;}
	.menu li.current a {color:#555;}

.nav-header {
    font-size: 14px;
}

/*
	FOOTER
*/
#footer 
{
	width:100%;
	border-top: 1px solid #ccc;
    padding-top:5px;
}

.notifications-badge {
    background-color: red;
    color: white;
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 6px;
    font-weight: bold;
}

/* -------------------------------------------------------------- 
   Grid
-------------------------------------------------------------- */

.xfluid { width: 100%; }

@media all and (max-width: 1200px)
{
	.xfluid .x1 		{ width: 100%; }
	.xfluid .x2 		{ width: 100%; }
	.xfluid .x3 		{ width: 100%; }
	.xfluid .x4 		{ width: 100%; }
	.xfluid .x5 		{ width: 100%; }
	.xfluid .x6 		{ width: 100%; }
	.xfluid .x7 		{ width: 100%; }
	.xfluid .x8 		{ width: 100%; }
	.xfluid .x9 		{ width: 100%; }
	.xfluid .x10 		{ width: 100%; }
	.xfluid .x11 		{ width: 100%; }
	.xfluid .x12 		{ width: 100%; }
}

@media all and (min-width: 1200px) 
{
	.xfluid .x1 		{ width: 6.33%; }
	.xfluid .x2 		{ width: 16.66%; }
	.xfluid .x3 		{ width: 25%; }
	.xfluid .x4 		{ width: 33.33%; }
	.xfluid .x5 		{ width: 41.66%; }
	.xfluid .x6 		{ width: 50%; }
	.xfluid .x7 		{ width: 58.33%; }
	.xfluid .x8 		{ width: 66.67%; }
	.xfluid .x9 		{ width: 75%; }
	.xfluid .x10 		{ width: 83.33%; }
	.xfluid .x11 		{ width: 89.67%; }
	.xfluid .x12 		{ width: 100%; }
}

.xfluid .x1, .xfluid .x2, .xfluid .x3, 
.xfluid .x4, .xfluid .x5, .xfluid .x6, 
.xfluid .x7, .xfluid .x8, .xfluid .x9, 
.xfluid .x10, .xfluid .x11,  .xfluid .x12 
{
	float:left;
}

.xbreak { clear: both; }

/* --------------------------------------------------------------------------------------------------------------------------------------------------
NAVBAR
-------------------------------------------------------------------------------------------------------------------------------------------------- */

/* The #navigation is the full navigation which is an unordered list */
.navigation {
    margin: 0;
    padding: 0;
    list-style: none;
    white-space: nowrap; /* This is optional but prevents from line wrapping */
    text-align: left;
    width: 100%; /* Width of the top level items */
    float: left; /* Floats navigation to the left */
}
 
/* The list items/links, removes the default styles for list items and makes them look like a menu by removing the bullets */
.navigation  li {
    margin: 0;
    padding: 0;
    list-style: none;
	border-bottom: 1px dotted #DDDDDD;
 }
 
.navigation  li {
    display: list-item;
    color: #4f8ba3; /* Changes font colour */
}
 
/* When submenus are not supposed to show, this hides them */
.navigation ul {
    position: absolute;
    left: -9999px;
}
 
.navigation  a {
    display: block; /* Makes the entire link (not just the text, as there is padding on the anchor) clickable */
    text-decoration: none; /* Gets rid of underlines in the link */
    padding: 8px; /* Padding to the link */
}
 
/* Styling for the optional in menu headings */
    .navigation h3 {
        margin: 0;
        background-color: #0069cb !important;
        border-bottom: 1px solid #CCCCCC;
        border-top: 1px solid #CCCCCC;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: bold;
        padding: 10px;
    }
 
/* This styling happens when a mouse hovers over the link */
.navigation li a:hover {
    background-color: #dcdcdc;
}

.navigation li a:hover.no-hover {
    background-color: transparent;
}
 
/* This styling happens to the submenu links when a top level link is hovered over  */
.navigation  li:hover > a {
    background-color: #dcdcdc;
}
 
/* This styling happens to the submenu ul when the top level list items are hovered over */
.navigation li:hover > ul {
    min-width: 130px;
    padding: 5px;
    left: 131px; /* For the example I needed the submenu to the right of the main menu, you may need to change this if you change the width */
    margin-top: -22px; /* Also for the example I used this to align the submenu with the link in the top level menu */
    border: 1px solid #dcdcdc;
    background: rgba(255,255,255,0.8); /* This css3 (rgba) adds a 80% transparency to the colour white */
    position: absolute; /* This makes the position set by css rather than where it thinks it should go */
}

.navigation li.selected a {
	background-color: #f0f0f0;
}

    .navigation li.selected {
        border-left: 4px solid #263849;
    }

.navigation li span 
{
	float:none;
	position:absolute;
	right:20px;
	font-weight:bold;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------
OTHERS
-------------------------------------------------------------------------------------------------------------------------------------------------- */
.dark_underbar
{
    border-bottom: 3px solid #101010;
}

.light_underbar
{
	border-bottom: 3px solid #f0f0f0;
}
.ellipsis-trim
{
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}

.results-label {
    font-weight:bold;
}
/* form display and data entry formatting */
.display-label
{
	clear:left; 
    float:left;
    margin:0.5em 0 0 0;
    margin-right: 6px;
    text-align:right;
	width:170px;
	font-weight:bold;
	/* overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis; */
}

.display-field
{
    margin:0.5em 0 0 180px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}

.display-field-wrap
{
    margin:0.5em 0 0 0;
	margin-left:180px;
}

.display-field-header
{
    margin:0.5em 0 0 180px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	border-bottom: 2px solid gray;
}

.editor-label
{
	clear:left;
    float:left;
    margin:0.5em 0 0 0;
    margin-right: 6px;
    text-align:right;
	width:170px;
	font-weight:bold;
}

.editor-field
{
	float:left;
    margin:0.5em 0 0 0;
}

.editor-label {
    vertical-align:baseline;
}
    
.editor-field {
    vertical-align:baseline;
}

.details-header
{
	clear:both;
	margin-bottom: 15px;
	display:block;
	border-bottom-width: 2px;
	border-bottom-color: Gray;
	border-bottom-style: solid;
}

.details-header p
{
	padding-bottom: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	color: Orange;
}

.form-line {
display: block;
float: left;
clear: both;
width: 600px;
margin: 0px 0px;
}

.gridview-name-input {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #999999;
    margin-right: 0.25em;
    margin-top: 4px;
    padding: 6px;
    width: 175px;
    border: 1px solid #cccccc;
    color: #424242;
    font-family: SofiaProLightRegular,Helvetica,Arial,Geneva,sans-serif;
    font-size: 12px;
    outline: medium none;
}

#search input {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #999999;
    margin-right: 0.25em;
    padding: 6px;
    width: 168px;
    border: 1px solid #cccccc;
    color: #424242;
    font-family: SofiaProLightRegular,Helvetica,Arial,Geneva,sans-serif;
    font-size: 12px;
    outline: medium none;
}

#search .submit {
    background: url("/Content/design/search-icon.png") no-repeat scroll 0 0 transparent;
    border: medium none !important;
    box-shadow: none;
    cursor: pointer;
    padding: 0;
    position: relative;
    right: -165px;
    top: -24px;
    width: 20px;
}
#search button {
    position: relative;
    top: -1px;
}

.search-icon-overlay {
    margin-left: -36px;
    position: relative;
    z-index: 2;
}

/* -------------------------------------------------------------
FORM
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media(max-width: 1530px) and (min-width: 1200px) {
    .portlet.x6 .field > label, .portlet.x6 .field span.label {
        float: none !important;
        text-align: left !important;
    }
}

@media(max-width: 1530px) {

    .form .header {
        margin-left: 0 !important;
    }

    .form .header-note {
        margin-left: 0 !important;
    }
}

@media(max-width: 1000px) {
    .field > label, .field span.label {
        float: none !important;
        text-align: left !important;
    }

    .controlset-pad {
        margin-left: 0 !important;
    }

    .form .field_help {
        margin-left: 10px !important;
    }

    .tab_container, .controlset.field, .tab_content {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
}

.fixed-button-spacer {
    height:50px;
    clear:both;
}

#fixed-button-container {
    padding:10px;
    position: fixed;
    bottom: 0%;
    width: inherit;
    background-color: #f0f0f0;
    border-top: 2px solid #FB471f;
    opacity: .9;
    z-index: 1000;
}

#fixed-button-container .buttons-right {
    margin-right:100px;
    float:right;
}

#fixed-button-container .buttons-left {
    float: left;
}

.form { padding: 0; margin: 0; }
.form .field { width: 100%; }
.form .field_help { margin-left: 255px; font-size: 90%; color: #777; }
.field > label, .form span.label { color: #444; margin-right: 10px; padding-right: 10px; width: 225px; display: block; float: left;  font-weight: bold; text-align: right; position: relative; }
.field label.narrow-label, .form span.narrow-label {
    width: 100px;
}
.field label em, 
.field span.label em { position: absolute; right: 0; font-size: 120%; font-style: normal; color: #C00; }
.form .upload { margin-bottom: -5em;}

.form .buttonrow { float: left; margin-top: 1em; margin-bottom: 2.5em; margin-left: 255px; display: block; }
.narrow-buttonrow {
    margin-left:120px;
}
.form .button-row { margin-top: 1em; margin-bottom: 2.5em; margin-left: 255px }
.button-row-right { float: right; margin-top: 1em; margin-bottom: 2.5em; padding-right:2.5em; display: block; }
.button-row-divider {
    display: inline;
    border: 2px solid #263849;
    margin-left: 15px;
    margin-right: 15px;
}
.form .button-row-left {
    margin-left: 120px
}
.form .cancel { font-size: 11px; color: #C00; padding-left: 10px; }
.form .field { margin-bottom: 0.75em; }
.form .uploader { margin-bottom: .5em !important; }
.form input[type=text], .form textarea, .form input[type=email], .field input[type=password], .form input[type=tel], .form input[type=number] {
    padding: 4px;
    margin-right: 1em;
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-bottom: 2px solid #CCC;
    outline: medium none;
}
    .form input[type=text]:focus, .form textarea:focus, .form input[type=email]:focus, .form input[type=password]:focus, .form input[type=tel]:focus, .form input[type=number]:focus,
    .form input.error:focus,
    .form textarea:focus {
        border-left: solid 1px #CCC;
        border-top: solid 1px #CCC;
        border-right: solid 1px #CCC;
        border-bottom: solid 2px black;
    }

 .form .field input.duplicate-warning {
     border: 1px solid orange;
     border-bottom:2px solid orange;
 }

.form .field input.duplicate-error {
    border: 1px solid red;
    border-bottom: 2px solid red;
}

.form input[type=text].validation-error, .form textarea.validation-error, .form input[type=email].validation-error, 
    .form input[type=password].validation-error, .form input[type=tel].validation-error, .form select.validation-error {
    border-bottom: 2px solid #ee0101;
}

.form .phone_field input { margin-right: 0; }

/* Reset Select */
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: 0;
    box-shadow: none;
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-bottom: 2px solid #CCC;
    background-image: none;
    border-radius: 0;
}

/* Custom Select */
div.select {
    position: relative;
    display: inline;    /* block */
    height: 2.5em;
    background: white;
    overflow: hidden;
}

select.select {
    width: auto;
    height: 2em;
    margin: 0;
    padding: 0 1.5em 0 .5em;
    color: black;
    cursor: pointer;
}

    select::-ms-expand {
        display: none;
    }
/* Arrow */
.select::after {
    content: '\25BC';
    color:#888;
    position: absolute;
    top: -2px;
    right: 0;
    bottom: 0;
    padding-right: .5em;
    pointer-events: none;
}
/* Transition */
.select:hover::after {
    color: #f39c12;
}
select.select:focus {
    border-bottom: 2px solid black;
}

.select::after {
    -webkit-transition: .25s all ease;
    -o-transition: .25s all ease;
    transition: .25s all ease;
}

.form div.controlset > label, .form div.controlset > input { display: inline; float: none; }
/* .form .controlset label {font-size: 11px; font-weight: normal !important; } */

.controlset { margin-bottom: 2.5em; float: left; }
.controlset .controlset-pad { margin-left:245px; }
.controlset .controlset-pad-fixed { width:500px; float: left; }

.label-inline-narrow .field > label, .label-inline-narrow .field > span.label {
    width: 120px;
}

.label-inline-narrow .controlset-pad {
    margin-left:140px;
}

.label-inline-narrow .field_help {
    margin-left: 140px;
}

.label-inline-narrow .buttonrow { 
    margin-left: 140px 
}

.header 
{
	clear:both;
	margin-bottom: 15px;
	display:block;
	border-bottom-width: 2px;
	border-bottom-color: Gray;
	border-bottom-style: solid;
}

.header-primary {
    clear: both;
    margin-bottom: 15px;
    display: block;
    border-bottom: 2px solid orange;
}

.header p
{
	padding-bottom: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	color: Orange;
}

.header-primary h2, .header-primary h1, .header h2, .header h1
{
    margin:.25em;
}

.form .header 
{
	clear:both;
	margin-bottom: 15px;
	margin-left: 240px;
	display:block;
	border-bottom-width: 2px;
	border-bottom-color: Gray;
	border-bottom-style: solid;
}

.form .header-note {
    margin-bottom: 15px;
    margin-left: 240px;
    display: block;
}

.form.label-inline-narrow .header
{
	margin-left: 140px;
}

.form .instructions
{
	clear:both;
	margin-bottom: 15px;
	margin-left: 240px;
	display:block;
}

.form .narrow {
    margin-left:140px;
}

.form .header p
{
	padding-bottom: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	color: Orange;
}

.form .header-flush {
	clear:both;
	margin-bottom: 15px;
	margin-left: 0px;
	display:block;
	border-bottom-width: 2px;
	border-bottom-color: Gray;
	border-bottom-style: solid;
}

.form .header-flush p {
	padding-bottom: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	color: Orange;
}

/* -------------------------------------------------------------- 
   Buttons
-------------------------------------------------------------- */
.button.green {
    background-color: #2A8FBD;
}

.button:hover {
	background-color: #333;		
}

.button {
	-webkit-transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;
	-moz-transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;
	-ms-transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;
	-o-transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;
	transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;	
}

.btn {
    background-repeat: repeat-x;
    color: #FFF;
    font-weight: bold;
    display: inline-block;
    text-decoration: none;
    border-width: 2px;
    border-style: solid;
    border-color: #263849;
    margin: 0;
    padding: .4em 1em;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    font-family: SofiaProLightRegular,Arial,Helvetica,sans-serif;
}
	
/* Active/Click state */
.btn:active { }

.btn.btn-white-border {
    border-color:white;
    font-size:14px;
}

.btn.btn-white-border:hover {
    border-color:white;
}

/* Sizes */
.btn { background-position:0 -80px; font-size:1.1em; }

	/* Sizes - Line height for A buttons need to be different */
	a.btn { height: 19px; font-weight:bold; border:2px solid #263849;}
	a.btn.btn-sm { line-height: 19px;  }
	a.btn.btn-lg { line-height: 42px; padding-bottom: 0; }
	
.btn.disabled, .btn:disabled {
    cursor: not-allowed;
    opacity: .35;
}

a.btn-small {
    height:24px;
    line-height:24px;
    font-size:.8em;
}

/* Fix the button in IE7 :-( */
*+html .btn, *+html .btn-icon { border-color:none; border: 1px solid transparent; }

/* Set default button colors */
.btn, .btn:visited {  background-color: #263849; color: #FFF; }

    .btn:hover {
        background-color: #004b96;
        color: #FFF;
        border-color: #004b96;
    }

    .btn:focus {
        outline: inherit;
        box-shadow: 0 0 0 0.75pt #F58220;
    }

.btn-orange,
.btn-orange:visited { background-color: #F90; border-color: #D58000; color: #FFF; }
.btn-orange:hover{ background-color: #D58000; color: #FFF; }

/* basic table formatting display */
table.basic { width: 100%; border: 0; margin-bottom: 1em; border-collapse: collapse; border-spacing: 0; }

	 table.basic thead th
	 {
	 	font-size: 13px;
		font-weight: bold;
		text-align: left;
		padding: 10px;
		
		background-color: #263849 !important;
		
		color: #FFF;
		
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}

        table.basic thead th.center {
            text-align: center;
        }

        table.basic thead th a {
            color: #fff;
            font-weight: bold;
        }

        table.basic thead th .fake-link {
            color: #fff;
            font-weight: bold;
        }

    table.basic tfoot td {
		padding: 10px;
        background-color: #FFF; 
    }

/*	table.basic td { vertical-align: top; } */

        table.basic th.currency {
            text-align: right;
        }

        table.basic td.currency {
            text-align: right;
        }

        table.basic td.center {
            text-align: center;
        }

        table.basic td.highlight {
            font-weight: bold;
        }

        table.details th.currency {
            text-align: right;
        }

        table.details td.currency {
            text-align: right;
        }

        table.details td.center {
            text-align: center;
        }

        table.details td.highlight {
            font-weight: bold;
        }

        table.small th.currency {
            text-align: right;
        }

        table.small td.currency {
            text-align: right;
        }

        table.small td.center {
            text-align: center;
        }

        table.small td.highlight {
            font-weight: bold;
        }

	table.basic tbody tr td { background-color: #FFF; border-bottom: 1px dotted #DDD; }

	table.basic th { padding: 10px 0; }
	table.basic tbody td { padding: 10px; }
	
	table.basic tbody tr.even td { background-color: #F9F9F9; }
    table.basic tbody tr.grey td { background-color: #F0F0F0; }
	
	table.basic tr:nth-child(odd) { background-color:#F9F9F9; }
	table.basic tr:nth-child(even) { background-color:#FFF; }

    table.basic .selected-cell { background-color:#263849 !important; }

    table.basic tr.selected-row { background-color:lightgray }

    /*table.basic tr.unselected-option td { background-color: #D0D0D0; }
    table.basic tr.unselected-option td input { opacity: 0.5; }*/
    table.basic tr.unselected-option #line_extended { text-decoration: line-through; }
    table.basic tr .unselected-option-line-extended { text-decoration: line-through; }

	table.basic tr td.basic-on  
	{
		padding: 10px;
		background-color: #dcdcdc;
		border-bottom: 1px dotted #DDD;
		color: #FFF;
	}

    td.bold {
        font-weight:bold;
    }

    table.basic tbody tr td.bold-subtotal {
        font-weight:bold;
        border-top: 2px solid black;
        border-bottom:none;
    }

    table.basic tbody tr td.bold-summary {
        font-weight:bold;
        border-bottom:none;
    }

table.basic thead tr th.group-start-seperator {
    border-left: 1px solid;
}

table.basic tbody tr td.subtotal-line {
    border-top: 2px dotted;
    background-color: #f0f0f0;
    font-weight: bold;
}

table.basic tbody tr td.total-line,
table.basic tfoot tr td.total-line {
    border-top: 2px solid;
    background-color: #d0d0d0;
    font-weight: bold;
}

table tbody td input.auto-width {
    width:100%;
}

/* basic table formatting display */
table.properties {
    width: 100%;
    border: 0;
    margin-bottom: 1em;
    border-collapse: collapse;
    border-spacing: 0;
}

    table.properties td.right {
        text-align: right;
    }

    table.properties td.center {
        text-align: center;
    }

    table.properties td.label {
        font-weight: bold;
        text-align: right;
    }

table.properties tbody td {
    padding: 5px;
}

table.properties td:nth-child(1) { text-align:right;font-weight:bold;width:170px;}

.auto-scroll-table {
    display: block;
    overflow-x: auto;
    width:100%;
}

.highlight-column {
    background-color: #dcdcdc !important;
}

td.no-wrap {
    width: 1%;
    white-space: nowrap;
}

th.no-wrap {
    width: 1%;
    white-space: nowrap;
}

/* basic table formatting display */
table.details { width: 100%; border: 0; border-collapse: collapse; border-spacing: 0; }

	 table.details thead th
	 {
	 	font-size: 11px;
		font-weight: bold;
		text-align: left;
		padding: 5px;
		
		background-color: #263849 !important;
		
		color: #FFF;
	}		
	
	table.details td 
	{ 
		vertical-align: middle;
		font-size: 11px;
	}
	
	table.details td.label 
	{ 
		text-align:right;
		font-weight:bold;
	}
	
	table.details th { padding: 10px 0; }
	table.details tbody td { padding: 4px; }
	
	table.details tbody tr.even td { background: #F9F9F9; }
	
	table.details tbody tr:nth-child(odd) { background-color:#F9F9F9; }
	table.details tbody tr:nth-child(even) { background-color:#FFF; }
    table.details tr.selected-row { background-color:lightgray }

	table.details tr td.details-on  
	{
		padding: 10px;
		background-color: #dcdcdc;
		border-bottom: 1px dotted #DDD;
		color: #FFF;
	}

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

	 table.small thead th
	 {
	 	font-size: 11px;
		font-weight: bold;
		text-align: left;
		padding: 5px;
		
		background-color: #263849 !important;
		
		color: #FFF;
	}		
	
	table.small td 
	{ 
		vertical-align: middle;
		font-size: 11px;
	}
	
	table.small td.label 
	{ 
		text-align:right;
		font-weight:bold;
	}
	
	table.small th { padding: 10px 0; }
	table.small tbody td { padding: 4px; }
	
    table.small tr.selected-row { background-color:lightgray }

	table.small tr td.details-on  
	{
		padding: 10px;
		background-color: #dcdcdc;
		border-bottom: 1px dotted #DDD;
		color: #FFF;
	}

/*	--------------------------------------------------
	Alerts
	-------------------------------------------------- */

	div.alert-box 
	{ 
		padding: 3px; 
		font-size: 16px; background: #eee; 
		border: 1px solid rgba(0,0,0,0.1); 
		position: relative; 
	}
	.alert-box.success { background-color:#558b2f; color:white; }
	.alert-box.warning { background-color:#f9a825; color:black; }
    .alert-box.warning a { color:black; }
	.alert-box.error { background-color:#c62828; color:white; }
	.alert-box.action { background-color:#E0761F; color:#333; }

    .alert-box p { margin:5px; }
    .alert-box a { color: white }
    .alert-box a.action-close { color: #333; position: absolute; right: 4px; top: 0px; font-size: 18px; padding: 4px; }
	.alert-box a.close { color: white; position: absolute; right: 4px; top: 0px; font-size: 18px; padding: 4px; }
	.alert-box a.close:hover,.alert-box a.close:focus { opacity: 0.4; }

    .form-validation-errors {
        display:none;
        margin-bottom:8px;
    }

.portlet
{
	background: #FFF;	
	position: relative;
	/* border: 1px solid #CCC; */
}

	.portlet-header
	{
		background: #F0F0F0;
		color: #444;
		text-align: left;
		padding: 10px 0 10px 0;
		width: calc(100% - 7px);
		position: relative;
		/* overflow: hidden; */
		border-bottom: 1px solid #CCC;
		border-left: 5px solid #263849;
	}

        .portlet-header.small {
            padding: 3px;
        }

    .portlet-header-span
    {
		font-size: 21px;			
		font-style: normal;
		font-weight: normal;
		line-height: 0.8;
		color: #263849;
		padding: 0 10px 0 10px;
		margin: 0;
		position: relative;
    }
		.portlet-state-closed .portlet-header { padding-bottom: 10px; }
	
		.portlet-header h4
		{
			font-size: 21px;			
			font-style: normal;
			font-weight: normal;
			color: #263849;
			padding: 0 0 0 10px;
			margin: 0;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
		}

        .portlet-header h5 {
            margin:.3em;
        }

		.portlet-state-closed .portlet-header { -moz-border-radius: 6px; -webkit-border-radius: 6px; }
		
	.portlet-content { 	padding: 5px 5px 5px; position: relative; }	
	
	.portlet-state-closed .portlet-content { display: none; }
	.portlet-state-closed h4 { border: none; }
	
		.portlet-toggle-icon
		{
			background: url(/Content/design/portlet-arrow-close.png) no-repeat 0 0 !important;
			width: 12px;
			height: 5px;
			display: block;
			position: absolute;
			right: 15px;
			top: 16px;
		}
	
		.portlet-state-closed .portlet-toggle-icon { background: url(/Content/design/portlet/portlet-arrow-open.png) no-repeat 0 0 !important; }
		
	.portlet-tab-nav
	{
		padding: 0;
		margin: 0;
		position: absolute;
		top: 8px;
		right: 10px;
	}
	
	.portlet-state-closed .portlet-tab-nav { display: none; }

.portlet-tab-nav > li
{
	border: solid 2px;
    background-color: rgb(240,240,240);
	line-height: 2em;
	list-style-type: none;
	float: left;
	margin: 0 1em 0 0;
    cursor:pointer;
}

.portlet-tab-nav > li:hover { background: #DDD; }

.portlet-tab-nav > li.disabled
{
	border: solid 2px;
    border-color: #AAA;
    background: #DDD;
    /*background-color: rgb(240,240,240);*/
	line-height: 2em;
	list-style-type: none;
	float: left;
	margin: 0 1em 0 0;
}
		
.portlet-tab-nav > li.disabled:hover { background: #DDD; }

.portlet-tab-nav > li.disabled a { cursor: default; color: #AAA; }

.portlet-tab-nav > li.disabled a:hover { cursor: default; }

.portlet-tab-nav .portlet-tab-nav-no-hover:hover { background: none; }

.portlet-tab-nav > li.spacer {
    height:26px;
}

/*override*/
.portlet-tab-nav-no-style
{
	padding: 0;
	margin: 0;
	position: absolute;
	top: 8px;
	right: 0px;
}

.portlet-tab-nav-no-style li
{
	background: transparent;
	line-height: 2em;
	list-style-type: none;
	float: left;
	margin: 0 1em 0 0;
}
		
.portlet-tab-nav-no-style li:hover { background: none; }

.portlet-tab-nav-no-style li a
{
	color: #444;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	padding: 5px 8px;
	outline: none !important;
}
			
.portlet-tab-nav-no-style li a:hover {  }

.portlet-tab-nav-no-style .portlet-tab-nav-active  a { color: #0B66B9; text-decoration: none; }

.portlet-tab-nav-no-style .portlet-tab-nav-active
{
	background-color: #263849 !important;
	border: 2px solid #263849;
}
/*end override*/

.portlet-tab-nav li a,
.portlet-tab-nav li .fake-link {
    color: #444;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    padding: 5px 8px;
    outline: none !important;
    cursor:pointer;
}
			
.portlet-tab-nav li a:hover {  }

.portlet-tab-nav li a .fa { font-size:15px; }

.portlet-tab-content { display: block; }
		
.portlet-tab-nav .portlet-tab-nav-active
{
	background-color: #263849 !important;
	border: 2px solid #263849;
}
		
.portlet-tab-nav-active a { color: #FFF !important; }
			
.portlet-tab-nav-active a:hover { text-decoration: none !important; }
		
.portlet-tab-content-active { display: block !important; }		
.portlet-tab-nav .portlet-tab-nav-active  a { color: #0B66B9; text-decoration: none; }


.portlet-menu-nav
{
}

ul.portlet-navigation {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 8px;
	right: 10px;
	border-left:1px solid #c4dbe7;
	border-right:1px solid #c4dbe7;
}

ul.portlet-navigation li {
	border: solid 2px;
    background-color: rgb(240,240,240);
	line-height: 2em;
	list-style-type: none;
	float: left;
	margin: 0 1em 0 0;
}

ul.portlet-navigation li a {
	color: #444;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	padding: 5px 8px;
	outline: none !important;
}

ul.portlet-navigation li a:hover {
    background: #DDD;
	color:#282828;
}

ul.portlet-navigation li:hover > a {
/*	background:#fff; */
}


/* Drop-Down Navigation */
ul.portlet-navigation li:hover > ul
{
/*these 2 styles are very important, 
being the ones which make the drop-down to appear on hover */
	visibility:visible;
	opacity:1;
}

ul.portlet-navigation ul, ul.portlet-navigation ul li ul {
	list-style: none;
    margin: 0;
    padding: 0;    
/*the next 2 styles are very important, 
being the ones which make the drop-down to stay hidden */
    visibility:hidden;
    opacity:0;
    position: absolute;
    z-index: 99999;
	border: solid 2px;
    background-color: rgb(240,240,240);
/* css3 transitions for smooth hover effect */
	-webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-o-transition:opacity 0.2s linear, visibility 0.2s linear; 
	transition:opacity 0.2s linear, visibility 0.2s linear; 	
}

ul.portlet-navigation ul {
    top: 43px;
    left: auto;
    width: 125px;
}

ul.portlet-navigation ul li ul {
    top: auto;
    left: 104px; /* strong related to width:180px; from above */
}

ul.portlet-navigation ul li {
	line-height: 2em;
	clear:both;
	width:100%;
	border:none
}

ul.portlet-navigation ul li a {
	color: #444;
	font-size: 11px;
	font-weight: bold;
	background:none;
	padding:5px 8px;
	text-decoration:none;
	display:inline-block;
	border:0 none;
	float:left;
	clear:both;
    width: 105px;
}
			
/* -------------------------------------------------------------- 
   Tabs
-------------------------------------------------------------- */
.tab_container { }

ul.tabs {
	margin: 0;
	padding: 2px;
	float: left;
	list-style: none;
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #fff;
	width: 100%;
}

    ul.tabs li {
        float: left;
        margin: 0;
        padding: 0;
        height: 31px;
        line-height: 31px;
        border: 1px solid #fff;
        border-bottom: 3px solid #fff;
        border-left: none;
        background: #f0f0f0;
        overflow: hidden;
        position: relative;
    }
	
		ul.tabs li a 
		{
			text-decoration: none;
			color: #263849;
			display: block;
			font-size: 1.2em;
			padding: 0 10px;
			border: 1px solid #f0f0f0;
			outline: none;
		}
		
        ul.tabs li.active a {
            font-weight:bold;
        }

        ul.tabs li:hover {
            border-bottom: 3px solid #263849;
        }
        ul.tabs li.active {
            background: #fff;
            border-bottom: 3px solid #263849;
        }

.tab_content_container 
{
	border-top: none;
	clear: both;
	float: left; 
	width: 100%;
	background: #fff;
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
	.tab_content { padding: 20px 20px 10px; }
	
.inbox_table .avatar { width: 60px; padding:10px; }
.inbox_table .full { width: 80%; font-size: 15px; }
.inbox_table .who { width: 20%;  text-align: right; font-size: 10px; color: #999; }

img.avatar_img
{
	width: 60px; 
	padding: 1px;
	border: 1px solid #CCC; 
	-moz-border-radius: 4px; 
	-webkit-border-radius: 4px; 
	border-radius: 4px; 

}

/* -------------------------------------------------------------- 
   Calendar Page
-------------------------------------------------------------- */
table.calendar 
{
	margin:0px 0 5px;
	clear:both;
	font-size:12px;
	border-collapse:collapse;
}

table.calendar, .calendar td { border:1px solid #bbb; }

table.calendar .day_number 
{
	color:#333;
	font-size:12px;
	padding:3px 9px;
	font-weight:bold;
	float:left;
}

table.calendar .day_event_count 
{
	color:#909090;
	font-size:12px;
	padding:3px 9px;
	float:right;
}

table.calendar .day_wrapper
{
	float:left;
	width:100%;
	height:100%;
}

table.calendar td .daynum { color: #555; }

table.calendar th 
{
	width: 250px;
	height: 10px;
	background: #263849  !important;
	
	color: #FFF;
	/* text-shadow: 0 0 1px rgba(0,0,0,.3); */
	padding:12px 0;
	text-align:center;
}

table.calendar td 
{
	height: 110px;
	width:14.28%;
	color: #114B7D;
	text-align: left;
	vertical-align: top;
	padding:0;
	font-size:12px;
}

.current_day
{
    background-color: #dddddd;
}

.calendar-summary-header {
    padding-left:10px;
}

table.calendar .event 
{ 
	width: 85%; 
	margin: 0 auto; 
	/* height: 17px; 
	overflow: hidden;
	white-space:nowrap;
	text-overflow: ellipsis; */
	display: block; 
	position: relative; 
}

table.calendar .nowrap
{ 
	width: 85%; 
	margin: 0 auto; 
	height: 17px; 
	overflow: hidden;
	/*white-space:nowrap;
	text-overflow: ellipsis;*/
	display: block; 
	position: relative; 
}

table.calendar .open_slot_summary 
{ 
	width: 92%; margin: 0 auto; height: 1.8em; overflow: hidden; display:block; position:relative;
	font-size:10px;
}

table.calendar .empty_slot_summary 
{ 
	width: 1%; margin: 0 auto; height: 2.4em; display:block; position:relative;
	font-size:10px;
}

table.calendar .event_title
{
	display: inline;
	font-size: 12px;
    padding:2px;
	position: relative;
	text-decoration: none;
    vertical-align:middle;
	z-index: 20;
    /* white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis; */
}

table.calendar .event_title_normal
{
	color: #222;
}

.event_title_tentative
{
	color: #808080;
    font-style: italic;
}

table.calendar .event_title_holiday
{
	font-weight:bold;
}

table.calendar .event_title:hover { color: #222; text-decoration: underline; }

table.calendar .event_time { display: inline; font-size: 11px; font-weight: bold; color: #263849; padding-right: .25em; }
.event_time_complete { display: inline; font-size: 11px; font-weight: bold; color: #53B54B; padding-right: .25em; }
.event_time_overdue { display: inline; font-size: 11px; font-weight: bold; color: #990000; padding-right: .25em; }
.event_time_in_process { display:inline; font-size:11px; font-weight: bold; color: #FF9900; padding-right: .25em; }

table.calendar .not_current_month { background: #F1F1F1; }
table.calendar .holiday { background: #d0d0d0; }
table.calendar .not_current_month .day_number { color: #888; }

#subscription-calendar-table td.not_current_month { 
    background: #f1f1f1 
}
#subscription-calendar-table td.holiday {
    background: #d0d0d0;
}


h2.calendar_header {
    font-size: 56px;
    text-align: center;
    line-height: 48px;
    margin-bottom: .5em;
    margin-top: .25em;
}
	h2.calendar_header button { top: -10px; margin: 0 1em; position: relative; }
		h2.calendar_header button:hover { color: #FFF !important; }
		
		h2.calendar_header button.previous { right: 25px; }
		h2.calendar_header button.next { left: 25px; }

.calendar_day_block:hover {
    z-index: 11 !important;
}
		
		
 td.clickable-day:hover, div.clickable-day:hover {
    cursor: pointer;
}

.split-text p {
    margin:2px;
}

.split-text .left {
    float:left;
    max-width:50%;
}

.split-text .right {
    float:right;
    max-width:50%; 
    text-align:right;
}

.calendar-flash-message {
    background-color: #f9a825;
    color: black;
    padding-left: 5px;
    padding-right: 5px;
}

.department {
    float: left;
    margin-bottom: 3em;
    width: 100%;
}

h2.section-header {
    border-bottom: 2px solid #fb471f;
    margin-bottom: 1.5em;
    padding-bottom: 4px;
}

.department h2 {
    border-bottom: 2px solid orange;
    font-size: 18px;
    margin-bottom: 1.5em;
    padding-bottom: 4px;
}
.user-card {
    float: left;
    font-size: 14px;
    margin: 0 1em 1.5em 0;
    width: 350px;
}
.user-card img {
    border: 1px solid #CCCCCC;
    /*border-radius: 4px 4px 4px 4px;*/
    padding: 1px;
}
.user-card .avatar {
    float: left;
    width: 96px;
}
.user-card .details {
    float: right;
    width: 240px;
}

/* drag and drop support classes */
.droppable {
}

.draggable { 
	cursor:pointer;
    z-index:10;
    list-style:none;
}

.calendar-timeslot-td {
    border-top-width:0; border-bottom-width:0; border-left-width:0; border-top-style:none; border-bottom-style:none; border-left-style:none; 
    border-right-width: 1px; border-right-style: solid; border-right-color: rgb(222, 223, 222); background-color: white;
}

.calendar-timeslot-available {
    background-color:white;
}

.calendar-timeslot-unavailable {
    background-color:#f0f0f0;
}

table.basic tbody tr td.droppable.drop-target-active {
    /* border:2px solid black; */
    background-color:lightgray;
}

table tbody tr td.droppable.drop-target-active, 
table tbody tr td div.droppable.drop-target-active {
    background-color: lightgray;
}

table.basic tbody tr td.droppable.drop-target-inactive {
    /* border:2px solid white; */
    background-color:white;
}

/* day view calendar styles */
.top_left_corner_td
{
    padding:0;
    border-width:0;
    border-style:none;
}
        
.top_left_corner_div
{
    position: relative; background-color: rgb(236, 233, 216); 
    font-size: 10pt; color: rgb(66, 101, 140); 
    width: 48px; 
    height: 25px; border-top-width: 1px;
    border-top-style: solid; border-top-color: rgb(206, 210, 206)
}

.timeslot_label_div
{
    width: 48px;            /* must match up with other timeslot column sizes */
    height: 40px; 
    overflow-x: hidden; 
    overflow-y: hidden;
}

.timeslot_label_td
{
    background-color: rgb(243, 243, 249); cursor: default; padding-top: 0px;
    padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px;
    border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none;
    border-right-style: none; border-bottom-style: none; border-left-style: none;
}

.column_td
{
    min-width: 250px; overflow-x: hidden; overflow-y: hidden; padding-top: 0px;
    padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px;
    border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none;
    border-right-style: none; border-bottom-style: none; border-left-style: none;
    height: 21px;
}

.column_div 
{
    background-color: rgb(243, 243, 249); 
    cursor: default; 
    position: relative;
    font-size: 10pt; 
    text-align: center;
    color: rgb(66, 101, 140);
    border-right-width: 1px; 
    border-right-style: solid; 
    border-right-color: rgb(206, 210, 206);
    height: 25px; 
}

.columns_table
{
    border-bottom-width: 0px;
    border-bottom-style: none; border-bottom-color: rgb(0, 0, 0); border-left-width: 1px;
    border-left-style: solid; border-left-color: rgb(206, 210, 206); border-top-width: 1px;
    border-top-style: solid; border-top-color: rgb(206, 210, 206); border-right-width: 1px;
    border-right-style: solid; border-right-color: rgb(206, 210, 206);
}
        
.column_label_div
{
    position: absolute; left: 0px; width: 100%; padding-top: 2px; padding-right: 2px;
    padding-bottom: 8px; padding-left: 2px; cursor: pointer;
    background-color: #263849;
    font-weight: bold;
}

.column_label_div a 
{
    color: #FFF;
}

.column_rev_div {
    position: absolute;
    left: 0px;
    width: 100%;
    padding-top: 2px;
    padding-right: 2px;
    padding-bottom: 8px;
    padding-left: 2px;
    cursor: text;
    background-color: white;
    color: black;
}
        
.appointment_block_td
{
    padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;
    border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;
    border-top-style: none; border-right-style: none; border-bottom-style: none;
    border-left-style: none; height: 1px; text-align:left; 
    left:5px;
    width: 240px;
}

.team-appt-list
{
    list-style-type: none;
    margin:0;
    padding:0;
}

/*
    PRICING
*/
.price-box {
    padding: 40px 0;
}
.price {
    padding-bottom: 20px;
    margin-top: 40px;
    text-align: center;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    z-index: 0;
}
.price h1 {
    font-size: 20px;
    color: White;
}
.price h2 {
    font-size: 25px;
    padding: 5px 0;
}
.price a {
    margin: 20px 0 10px 0;
}
.price-head {
    border-bottom: 1px solid #e9e9e9;
    padding-top: 5px;
    background-color: #263849;
}
.big-price {
    /* -moz-box-shadow: 0 0px 30px #999999;
    -webkit-box-shadow: 0 0px 30px #999999;
    box-shadow: 0 0px 30px #999999; */
    background: none repeat scroll 0 0 #f0f0f0;
    font-size: 1.2em;
    margin-top: 0px;
    padding-bottom: 10px;
    z-index: 100;
}
.big-price h2 {
    font-size: 30px;
    padding: 10px 0;
}
.big-price.price-head {
    border-bottom: 1px solid #e9e9e9;
    padding-top: 40px;
}
ul.price-list
{
	padding-left:0px;
}
ul.price-list li 
{
    padding: 5px 0;
    border-bottom: 1px solid #f9f9f9;
    list-style:none outside none;
}

/* training tags */
.tag.read 
{
    background-color: #263849;
}
.tag 
{
    border-radius: 5px 5px 5px 5px;
    color: #FFFFFF;
    display: inline;
    font-size: 14px;
    padding: 3px 8px;
    text-align: center;
    white-space: nowrap;
    width: 60px;
    margin: 3px;
}
.tag a 
{
	color: #ffffff;
	text-decoration:none;
}

.tour-item {
    float: left;
    font-size: 11px;
    margin: 1em 1em 1.5em 1em;
    width: 200px;
}

.loading-wait {
    display: none;
    position: fixed;
    top: 50%;
    left : 50%;
    margin-top: -16px;
    margin-left: -16px;
    z-index:10000;
}

.info_table .value { width: 25%; font-size: 18px; font-weight: bold; color: #263849; }

.service-details 
{
	border-top: 2px solid gray;
	border-bottom: 2px solid gray;
	margin-bottom: 8px;
    padding:4px;
}

/* -------------------------------------------------------------- 
   Reports Page
-------------------------------------------------------------- */	
.big-stats 
{ 
	/* background: #f3f3f3;  */
	width: 100%; 
	padding: 0; 
	float: left; 
	margin-bottom: 3em;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px; 	
}

	*+html .big-stats { padding-bottom: 2em; }

.stat
{
	width: 15%;
	height: 130px;
	padding: 0 2%;
	float: left;
	position: relative;
	border-left: 1px dotted #CCC;
}

	*+html .stat { height: 100px; }

.stat:first-child { border: none; }

.stat h4
{
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #999;
	margin-bottom: 1.5em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.stat .value
{
	font-weight: bold;
	color: #263849;
	line-height: 1em;
}

    .stat .value {
        font-size: 48px;
    }

    @media(max-width: 1300px) {
        .stat .value {
            font-size: 40px;
        }
    }

    @media(max-width: 1000px) {
        .stat .value {
            font-size: 32px;
        }
    }

.stat .value-small {
    font-size: 32px;
}

@media(max-width: 1300px) {
    .stat .value-small {
        font-size: 24px;
    }
}

@media(max-width: 1000px) {
    .stat .value-small {
        font-size: 18px;
    }
}

.stat .view_all
{
	font-size: .9em;
	position: absolute;
	right: 20px;
	bottom: 12px;
}

.stat .details
{
    text-align: right;
    font-size: .9em;
    max-width: 100%;
}

.stat .details p
{
    text-align:right;
    margin:0;
}

.reports_table .value { width: 100px; text-align: right; }
	.reports_table .value span { background: #F90; font-size: 11px; font-weight: bold; color: #FFF; width: 40px; text-align: center;  padding: 3px 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
	
.reports_table td { padding: 5px; }

/* ---- invoice formatting ---- */
.report .total-options {
    text-align: right;
    border-top: 2px solid #666;
    font-weight: bold;
}

/* ---- invoice formatting ---- */
#invoice .total,
#invoice .price { text-align: right; }
#invoice .total-options {
    text-align: right;
    border-top: 2px solid #666;
    font-weight: bold;
}

#invoice .sub_total,
#invoice .grand_total { text-align: right; border-bottom: none; }
#invoice .total { text-align: right;border-bottom: none; font-weight:bold }

#invoice .sub_total { border-top: 2px solid #666; font-weight:bold }
#invoice .grand_total { font-size: 14px; font-weight: bold; }

#invoice .client_details,
#invoice .invoice_details { font-size: 11px; padding: 0; margin: 0 0 1em; float: left; width: 50%; }

	#invoice .invoice_details { float: right; }
	#invoice .client_details li,
	#invoice .invoice_details li { list-style-type: none; }
	
#invoice .name { font-size: 14px; }

/* ---- invoice formatting ---- */
.invoice .total,
.invoice .price { text-align: right; }
.invoice .total-options {
    text-align: right;
    border-top: 2px solid #666;
    font-weight: bold;
}

.invoice .sub_total,
.invoice .grand_total { text-align: right; border-bottom: none; }
.invoice .total { text-align: right;border-bottom: none; font-weight:bold }
.invoice .deposit { text-align: right;border-bottom: none; font-weight:bold }

.invoice .sub_total { border-top: 2px solid #666; font-weight:bold }
.invoice .grand_total { font-size: 14px; font-weight: bold; }
.invoice .deposit { font-size: 14px; font-weight: bold; }

.invoice .client_details,
.invoice .invoice_details { font-size: 11px; padding: 0; margin: 0 0 3em; float: left; width: 50%; }

	.invoice .invoice_details { float: right; }
	.invoice .client_details li,
	.invoice .invoice_details li { list-style-type: none; }
	
.invoice .name { font-size: 14px; }

.field .date_picker {
    width:100px;
}

.date_picker {
    width: 100px;
}

.ui-datepicker{ z-index: 9999 !important;}

/* --------------------------------------------------------------------
	Audio Player
-----------------------------------------------------------------------*/

.audiojs 
{ 
	height: 22px; background: #404040;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444), color-stop(0.5, #555), color-stop(0.51, #444), color-stop(1, #444));
	background-image: -moz-linear-gradient(center top, #444 0%, #555 50%, #444 51%, #444 100%);
	-webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3);
	-o-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); 
	width: 275px;
}
.audiojs .play-pause 
{ 
	width: 15px; 
	height: 20px; 
	padding: 0px 8px 0px 0px;
}
.audiojs p 
{ 
	width: 25px; height: 20px; margin: -3px 0px 0px -1px; 
}
.audiojs .scrubber 
{ 
	background: #5a5a5a; width: 125px; height: 10px; margin: 5px; 
}
.audiojs .progress 
{ 
	height: 10px; 
	width: 0px; 
	background: #ccc;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ccc), color-stop(0.5, #ddd), color-stop(0.51, #ccc), color-stop(1, #ccc));
	background-image: -moz-linear-gradient(center top, #ccc 0%, #ddd 50%, #ccc 51%, #ccc 100%); 
}
.audiojs .loaded  
{
	height: 10px; background: #000;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #222), color-stop(0.5, #333), color-stop(0.51, #222), color-stop(1, #222));
	background-image: -moz-linear-gradient(center top, #222 0%, #333 50%, #222 51%, #222 100%); 
}
.audiojs .time 
{ 
	float: left; height: 25px; line-height: 25px; 
}
.audiojs .error-message 
{ 
	height: 24px;line-height: 24px; 
	width: 230px;
}

.drop-zone
{
	padding: 10px;
	font-size: 16px;
	border: 1px solid black;
	margin: 2px;
}

.drop-zone-active
{
	padding: 8px;
	font-size: 16px;
	border: 3px solid #101010;
}

#picture_gallery .progress
{
    height:20px;
    background-color: white;
}

#document_gallery .progress
{
    height:20px;
    background-color: white;
}

.progress .bar
{
    background-color: #263849;
    border-radius: 0 0 0 0;
}

.proposal-search-link
{
	font-size:12px;
}

.proposal-invoiced
{
    -moz-border-radius:0px !important;
    -webkit-border-radius:0px !important;
    border-radius:0px !important;
	background-color: #CCC !important;
}

.proposal-invoiced span
{
    color:#CCC !important;
}

.part-search-select-link
{
	font-size:12px;
}

/* individual thumbnails */
div.thumbnail-image {
    padding: 3px;
    margin: 0;
    background: 0;
    min-width: 100px;
    height: 100px;
    text-align: center;
    list-style-type: none;
    float: left;
    position: relative;
    margin: 13px 17px 10px 10px;
    border: 1px solid #ccc;
    box-shadow: 0 0 3px rgba(0,0,0,.20);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.20);
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.20);
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}
div.thumbnail-image .actions {
    min-width: 100px;
    height: 100px;
    display: block;
    z-index: 10;
    position: absolute;
    text-align: center;
    left: 24px;
    top: 0;
    display: block;
    padding: 3px;
    line-height: 100px;
}

/* -------------------------------------------------------------- 
   Gallery Page
-------------------------------------------------------------- */
ul.gallery { padding: 0; margin: 0; display:inline-block;}

.gallery li {
	padding: 3px;
	margin: 0;
	background: 0;
	min-width: 100px;
	height: 100px;
	text-align: center;
	
	list-style-type: none;
	
    float: left;

	position: relative;
	margin: 13px 17px 10px 10px;
	border: 1px solid #ccc;
	box-shadow: 0 0 3px rgba(0,0,0,.20);
	-moz-box-shadow: 0 0 3px rgba(0,0,0,.20);
	-webkit-box-shadow: 0 0 3px rgba(0,0,0,.20);
	
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.gallery li div.text-overlay {
    position: absolute; 
    width: 100%; 
    bottom: 0px; 
    left: 0px; 
    background-color: #000000; 
    color:#FFFFFF; 
    opacity: 0.8;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.gallery li.gallery-icon-big { width: 150px; height: 150px; }
	
.gallery li:hover { border-color: #888; }

.gallery li.select_library_item_link:hover { cursor: pointer; }

.gallery li.selected { box-shadow: inset 0 0 0 3px #558b2f; }

.gallery li .image_limit_reached {
    display: block;
    opacity: 0;
    box-shadow: inset 0 0 0 3px #ff0000; 
    width: 100%; height: 100%; 
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
    transition: opacity ease .4s;
}

.gallery li.selected .image_limit_reached {
    opacity: 1;
}

.gallery li.has-note { border: 1px solid orange; }	

.gallery li .actions
{
	min-width: 100px;
	height: 100px;
	display: block;
	z-index: 10;
	position: absolute;
	text-align: center;
	left: 24px;
	top: 0;
	display: block;
	padding: 3px;
	
	line-height: 100px;
}

.gallery li .actions-big
{
    width: 150px;
	height: 150px;
	display: block;
	z-index: 10;
	position: absolute;
	text-align: center;
	left: 0;
	top: 0;
	display: block;
	padding: 3px;
	
	line-height: 150px;
}

.gallery .actions .btn { padding: 0 5px 2px; }

.gallery .actions .btn,
.gallery .actions .btn:hover { color: #FFF !important; }

.gallery .actions .btn:first-child { margin-top: 20px; margin-bottom: 1em; }
	
/*.gallery li:hover .actions { display: block; } */

	*+html .gallery .actions .delete { top: -12px; position: relative; }

.gallery-drop-target
{
	border:3px solid !important;
}

.backlog_appts_list
{
	list-style:none;
	padding:0;
	margin:0;
	width:100%;
}

.backlog_appts_item {
    clear: both;
    display: list-item;
    list-style: none;
    border-bottom: 1px dotted #263849;
}

/* li.backlog_appts_item:nth-child(odd) { background-color:#E9E9E9; }
li.backlog_appts_item:nth-child(even) { background-color:#FFF; } */

li.backlog-recently-moved:nth-child(odd) {
    background-color: #DDEEFF;
}

li.backlog-recently-moved:nth-child(even) {
    background-color: #DDEEFF;
}

.backlog_appts_item .bl_checkbox
{
	width:30px;
	height:50px;
	float:left;
}

.backlog_appts_item .bl_header
{
	display:block;
	width:100%;
}

.backlog_appts_item .bl_service
{
	float:initial;
	font-weight:bold;
}

.backlog_appts_item .bl-details
{
    overflow:auto;
	width:100%;
}

.backlog_appts_item .bl_address
{
	float:right;
    text-align:right;
}

.backlog_appts_item .bl-driving-info
{
	float:right;
}

/* 
Easy Drop Down for jQuery
appgrinders.github.com/jquery-easy-drop-down 
*/

/* REQUIRED
================================================== */

.dropdown  {
	border: 2px solid black;
    position: relative;
	display:inline-block;
}
.dropdown-button {
	display: block !important;
	margin:0 !important;
	cursor: pointer;	
}
.dropdown-panel {
    position: absolute !important;
    display: none;
    width: 99%;
    overflow: auto;
    z-index: 5000;
}

.dropdown-apply-buttons {
    float: right;
    margin-top: 1em;
    display: block;
}

/* BASIC STYLES
================================================== */

.dropdown-button {
	background:#DDD;
	padding: 5px;
    font-weight: bold;
    font-size: 11px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
a.dropdown-button,
a.dropdown-button:visited {
	color:inherit;
}
a.dropdown-button:hover {
	text-decoration:none;
}
a.dropdown-button img.dropdown-icon {
    margin-left: 2px;
	/*margin:8px 0px 4px 10px;*/
}

div.filter-term > a {
    color:black;
}

div.dropdown-menu > a {
    color:black;
}

.dropdown-item {
    text-align: left;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none;
    color: #555;
    padding: 5px;
}

.dropdown-item:hover {
    background-color: #C1C1C1;
    text-decoration: none;
}

.dropdown-panel {
    /* max-height: 600px; */
    min-height:100px;
	min-width:200px;/**/
	border: 2px solid black;
	background:white;
	/*padding:10px;/**/

	/* Border-box model so that padding doesn't affect dimensions. See http://css-tricks.com/box-sizing */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	/* moz-box-shadow: 0 0 13px rgba(0,0,0,0.31);
	-webkit-box-shadow: 0 0 13px rgba(0,0,0,0.31);
	box-shadow: 0 0 13px rgba(0,0,0,0.31); */
	
	/*border-radius: 5px;/**/
	padding:10px 20px;
    margin-top:5px;

    overflow: auto;
    max-height: 500px;
}

.dropdown-menu-panel {
    padding: 0px;
    margin-left: -130px;
    margin-top: 5px;
}

.actions-menu {
    cursor:pointer;
}

.simpleColorChooser {
    z-index: 10;
}

.initially-hidden 
{
	display:none;
}

.wiki-content {
}
.wiki-content h2 {
    margin-bottom:0px;
}
.wiki-content p {
	font-size: 16px;
    padding-right: 10px;
    margin-top: 0px;
}

    .wiki-content .column {
    }

.marketplace-content {

}

.marketplace-content p {
	font-size: 16px;
    padding-right: 10px;
}

.box-shadow-menu {
    height:16px;
    width:16px;
    float:left;
    margin:4px;
    cursor:pointer;
    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpGQkVCRURCNjcyNkExMUUyOUVGMERGNEQ0Q0Q0MUYxNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpGQkVCRURCNzcyNkExMUUyOUVGMERGNEQ0Q0Q0MUYxNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkZCRUJFREI0NzI2QTExRTI5RUYwREY0RDRDRDQxRjE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkZCRUJFREI1NzI2QTExRTI5RUYwREY0RDRDRDQxRjE2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+r/VsTgAAAEVJREFUeNpi/P//PwMlgImBQkCxASwgorS09DyQMiBR74Xu7m5Dil3AQEkggvRSJwxKSkrICgMgHg0DaoQB49DPTAABBgCgyx3HVRfgPQAAAABJRU5ErkJggg==");
}

.scroll-to-save
{
    position:fixed;
    top:50%;
    right:0%;
    opacity:.5;
}

.take-a-tour
{
    position:fixed;
    top:150px;
    right:0%;
    opacity:.7;
}

.store-table {
    width: 100%;
    height: 150px;
}

tr.store-item-row:nth-child(odd) { background-color:#F0F0F0; }
tr.store-item-row:nth-child(even) { background-color:#FFF; }

.store-table h2 {
    border-bottom: 1px dotted #CCCCCC;
    /*color: #FF9900;*/
    margin-top: 4px;
    margin-bottom: 0px;
    font-size: 18px;
    padding-bottom: 4px;
}

.cart-table {
    width: 100%;
}

.cart-table h2 {
    margin-top: 0px;
    margin-bottom: 4px;
    font-size: 14px;
}

.cart-item-totals {
    width:30%;
    text-align:right;
}

.checkout-item-totals {
    text-align:right;
}

#store-image-cell-container {
    width: 150px;
    padding-right: 10px;
}

#store-image-cell-container .store-image-cell {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: relative;
    text-align: center;
}

#store-image-cell-container .store-image-cell img{
    position: relative;
}

#store-image-cell-container .store-image-cell span.store-item-name{
    width: 100%;
    background-color: yellow;
    position: absolute;
    text-align: center;
    right: 0px;
    bottom: 0px;
    background-color: #000000;
    color: #ffffff;
    padding: 2px;
    opacity: 0.4;
}

.store-content-cell {
    /*width:80%;*/
    vertical-align: text-top;
}

.store-content-description {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    width: 100%;
    height: 100px;
}

/*.store-pricing-cell {
    width: 10%;
}*/

.store-item-price {
    float: right;
}

.cart-item-price {
    margin-top: 0px;
    margin-bottom: 0px;
    float: right;
}

.primary-store-image {
    outline: thick;
    outline-color: #263849;
}

.store-item-image {
    float: left;
    padding-right: 20px;
    padding-bottom: 20px;
}

.store-item-images-container {
    width: 308px;
}

.store-item-images-menu-container {
    float: left;
    text-align: left;
    width: 308px;
}

.store-item-images-menu-container img {
    padding-right: 5px;
}

.store-item-description {
    width: 100%;
}

.store-paging-container {
    font-size: 16px;
    /*font-weight: bold;*/
}

.store-paging-container a {
    text-decoration: none;
}

.store-paging-container a:hover, .store-paging-container a:active, .store-paging-container a:focus {
}

.store-current-page {
    text-decoration: none;
    color: #263849;
}

.store-page {
    border: thin solid;
    border-color: #263849;
    display: inline-block;
    color: #263849;
    padding: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 2px;
}

.store-page-number {
    border: thin solid;
    border-color: #263849;
    color: #263849;
    width: 25px;
    display: inline-block;
    padding: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 2px;
    text-align:center;
}

.store-current-page {
    border: thin solid;
    border-color: #263849;
    background-color: #263849;
    color: #FFFFFF;
    width: 25px;
    display: inline-block;
    padding: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 2px;
    text-align:center;
}

.bar-main-container {
  margin: 10px auto;
  width: 300px;
  height: 28px;
  font-family: sans-serif;
  font-weight: normal;
  font-size: 0.8em;
  color: #FFF;
}

.bar-wrap { padding: 9px; }

.bar-percentage {
  float: left;
  background: rgba(0,0,0,0.13);
  padding: 0px 0px;
  width: 18%;
  height: 16px;
  text-align: center;
  margin-top: -3px;
}

.bar-container {
  float: right;
  height: 10px;
  background: rgba(0,0,0,0.13);
  width: 78%;
  margin: 0px 0px;
  overflow: hidden;
}

.bar {
  float: left;
  background: #FFF;
  height: 100%;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.send_sms_message {
    display: none;
}

.call_phone_number {
    display: none;
}

table#menu_tree_table_style tbody tr td.active_row_bar_color {
    background-color: #263849;
}


/* COLORS */
.azure   { background: #38B1CC; }
.emerald { background: #2CB299; }
.violet  { background: #8E5D9F; }
.yellow  { background: #EFC32F; }
.red     { background: #E44C41; }
.sm-blue { background: #263849; }



div.console { font-size: 14px }
div.console div.jquery-console-inner
 { width:100%; height:800px; background:white; padding:0.5em;
   overflow:auto }
div.console div.jquery-console-prompt-box
 { color:black; font-family:monospace; }
div.console div.jquery-console-focus span.jquery-console-cursor
 { background:#263849; color:white; font-weight:bold }
div.console div.jquery-console-message-error
 { color:#ef0505; font-family:sans-serif; font-weight:bold;
   padding:0.1em; }
div.console div.jquery-console-message-value
 { color:black; font-family:monospace;
   padding:0.1em; }
div.console div.jquery-console-message-type
 { color:#52666f; font-family:monospace;
   padding:0.1em; }
div.console span.jquery-console-prompt-label { font-weight:bold }

/* Builder Css */

#toolbar-preview-icons {
  margin: 0 auto;
  margin-top: 3px;
  text-align: center;
  width: 150px;
}
#toolbar-preview-icons li > i {
  cursor: pointer;
  display: inline;
  color: #cfd2d9;
  font-size: 25px;
  margin-right: 10px;
}
#toolbar-left-buttons li a {
  outline: none !important;
}
#toolbar-preview-icons > li > i:hover,
#toolbar-preview-icons > li > i.active {
  color: #263849;
}

.image-select-overlay {
    position: relative;
    display: table;
}

.image-select-overlay img {
    vertical-align:top;
}

.image-select-overlay:after {
    position: absolute;
    opacity: 0;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}
.image-select-overlay:after {
    content: '\A';
    width: 100%; height:100%;
    top: 0; left:0;
    background:rgba(0,0,0,0.3);
    cursor: pointer;
}
.image-select-overlay:hover:after {
    opacity: 1;
}

.sms-message-reply-text {
    display: inline-block;
    margin: 0px;
    padding: 5px;
    background-color: #0072C6;
    color: #FFFFFF;
    margin-bottom: 3px;
    max-width: 80%;
}

.sms-message-reply-text-contact {
    display: inline-block;
    margin: 0px;
    padding: 5px;
    background-color: #CCC;
    margin-bottom: 3px;
    max-width: 80%;
}

.sms-message-row-selected td.sms-message-cell {
    background-color: #0072C6;
    color: #FFFFFF;
}

.sms-message-row-selected td a{
    color: #FFFFFF;
}

.sms-unread-messages {
    background-color: #0072C6;
    float: left;
    height: 40px;
    width: 5px;
    display: inline;
    position: absolute;
    margin-left: -10px;
    margin-top: -10px;
}

.div-button {
    text-align: center;
    height: 100%;
    background-color: #263849;
    border: 1px solid #263849;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
    line-height: 100%;
}

.div-button:hover {
    background-color: #0072C6;
    border: 1px solid #0072C6;
    cursor: pointer;
}

.div-button-no-border {
    text-align: center;
    height: 100%;
    background-color: #263849;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 14px;
    line-height: 100%;
}

.div-button-no-border:hover {
    background-color: #0072C6;
    cursor: pointer;
}

.calendar-edit-option {
    
}

div.collateral-item-tag {
    display:inline;
    border: 1px solid #263849;
    padding: 5px 5px 5px 5px;
    margin-left: 3px;
    margin-right: 3px;
    line-height: 35px;
}

div.collateral-item-tag:hover {
    cursor: pointer;
    background-color:#0072C6;
    border: 1px solid #0072C6;
    color:white;
}

div.collateral-item-tag.selected {
    background-color:#263849;
    color:white;
    border: 1px solid #263849;
}

div.collateral-item-tag.unselected {
    opacity:.65;
}

div.collateral-item-tag.unselected:hover {
    opacity:1;
}

div.picture-tag-filter, div.document-tag-filter, div.timeline-tag-filter {
    display: inline;
    border: 1px solid #263849;
    padding: 5px 5px 5px 5px;
    margin-left: 3px;
    margin-right: 3px;
    line-height: 35px;
}

div.picture-tag-filter:hover, div.document-tag-filter:hover, div.timeline-tag-filter:hover {
    cursor: pointer;
    background-color: #0072C6;
    border: 1px solid #0072C6;
    color: white;
}

div.picture-tag-filter.selected, div.document-tag-filter.selected, div.timeline-tag-filter.selected {
    background-color: #263849;
    color: white;
    border: 1px solid #263849;
}

div.picture-tag-filter.unselected, div.document-tag-filter.unselected, div.timeline-tag-filter.unselected {
    opacity: .65;
}

div.picture-tag-filter.unselected:hover, div.picture-tag-filter.unselected:hover, div.timeline-tag-filter.unselected:hover {
    opacity: 1;
}

div.tag-filter {
    display: inline;
    border: 2px solid #263849;
    padding: 5px 5px 5px 5px;
    margin-left: 3px;
    margin-right: 3px;
    line-height: 35px;
}

div.tag-filter:hover {
    cursor: pointer;
    background-color: #0072C6;
    border: 2px solid #0072C6;
    color: white;
}

div.tag-filter.selected {
    background-color: #263849;
    color: white;
    border: 2px solid #263849;
}

div.tag-filter.unselected {
    opacity: .65;
}

div.tag-filter.unselected:hover {
    opacity: 1;
}

span.calendar-option {
    -webkit-user-select:none; 
    text-align:center; 
    display:none; 
    position: absolute; 
    top: 0px; 
    right: -13px;
}

i.calendar-options-edit-icon {
    color:white; 
    font-size: 19px; 
    line-height: 25px;
    width: 25px;
}

i.calendar-options-edit-icon:hover {
    background-color: #0072C6;
}

i.calendar-options-edit-icon-inline {
    color: #263849; 
    font-size: 1em; 
    line-height: 14px;
    width: 14px;
}

i.calendar-options-edit-icon-inline:hover {
    color: #0072C6;
    border-bottom: 1px solid #263849;
}

.target-contact-select {
    width: 200px; 
    text-align: center; 
    background-color: #263849; 
    font-size: 16px; 
    margin-left: auto; 
    margin-right: auto;
    color: white;
}

.target-contact-selected {
    width: 200px; 
    text-align: center; 
    background-color: #7fae00; 
    font-size: 16px; 
    margin-left: auto; 
    margin-right: auto;
    color: white;
}

.target-contact-select:hover {
    background-color: #004B96;
    cursor: pointer;
}

.accent-block-blue {
    background-color: #263849; 
    padding:4px;
    font-size: 14px; 
    font-weight:bold;
    color: white;
}

.accent-block-red {
    background-color: #c62828; 
    padding:4px;
    font-size: 14px; 
    font-weight:bold;
    color: black;
}

span.grippy {
  content: '....';
  width: 10px;
  height: 20px;
  display: inline-block;
  overflow: hidden;
  line-height: 5px;
  padding: 3px 4px;
  cursor: move;
  vertical-align: middle;
  margin-top: -.7em;
  margin-right: .3em;
  font-size: 12px;
  font-family: sans-serif;
  letter-spacing: 2px;
  color: black;
  text-shadow: 1px 0 1px black;
  white-space:normal;
}
span.grippy::after {
  content: '.. .. .. ..';
}
span.grippy.selected {
    font-weight:900;
}

.ui-draggable.ui-draggable-dragging {
}

.geozone-tag 
{
    display:inline-block;
    border:solid 2px;
    padding:3px;
    margin:3px;
    cursor:pointer;
}

.geozone-calendar-tag {
    display:inline-block;
    border:solid 2px;
    padding:3px;
    margin:3px;
    cursor:pointer;
}

.schedule-tag 
{
    display:inline-block;
    border:solid 2px;
    padding:3px;
    margin:3px;
    cursor:pointer;
}

.first-day-label {
    color: black;
    font-weight:bold;
    float:left;
    padding-right:2px;
}

.day-label {
    float:left;
    padding-right:2px;
}

.day-count {
    color: #909090;
    float: right;
}

#route-schedule-table th .calendar-header {
    text-align:center;
}

.calendar-date {

}

#subscription-calendar-table td {
    width:14.285%;
    border:1px solid #bbb;
    height:75px;
    vertical-align:top;
}

#route-schedule-table td {
    width:14.285%;
    border:1px solid #bbb;
    height:75px;
    vertical-align:top;
}

.header-color-block {
    vertical-align: middle;
    display: inline-block;
    /* margin-left:3px;
    margin-right:3px; */
    width: 12px;
    height: 12px;
    border: 2px solid white;
}

.tag-color-block {
    vertical-align:middle;
    display:inline-block;
    /* margin-left:3px;
    margin-right:3px; */
    width:10px;
    height:10px;
    border:2px solid black;
}

.tag-title {
    padding-right:5px;
}

.sparkline-chart {
    border-bottom:solid 2px #d0d0d0;
    width:256px;
    height:32px;
}

#chartjs-tooltip {
    padding: 4px 6px;
    text-align:center;
    opacity: 1;
    position: absolute;
    background: rgba(0, 0, 0, .7);
    color: white;
    border-radius: 3px;
    -webkit-transition: all .1s ease;
    transition: all .1s ease;
    pointer-events: none;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.sm-input-control {
    position: relative;
    display: inline-block;
    min-width: 16px;
    min-height: 16px;
    vertical-align: middle;
}

.sm-input-control-label {
    display: inline-flex;
}

.sm-input-control input {
    position: absolute;
    z-index: 1;
    opacity: 0;
    top: -3px;
    width: 16px;
    left: -4px;
    height: 16px;
}

.sm-input-control-display {
    position: absolute;
    top: 0px;
    left: 0;
    width: 14px;
    height: 14px;
    background: #fff;
    border: 1px solid #263849;
}

.sm-input-control-radio .sm-input-control-display {
    border-radius: 50%;
}

/* Hover and focus states */
.sm-input-control:hover input ~ .sm-input-control-display {
    background: #e6e6e6;
}

/* Checked state */
.sm-input-control input:checked ~ .sm-input-control-display {
    background: #fff;
}

/* Hover state whilst checked */
.sm-input-control:hover input:not([disabled]):checked ~ .sm-input-control-display {
    background: #e6e6e6;
}

/* Disabled state */
.sm-input-control input:disabled ~ .sm-input-control-display {
    pointer-events: none;
    opacity: .6;
    background: #e6e6e6;
}

/* Check mark */
.sm-input-control-display:after {
    position: absolute;
    display: none;
    content: '';
}

/* Show check mark */
.sm-input-control input:checked ~ .sm-input-control-display:after {
    display: block;
}

/* Checkbox tick */
.sm-input-control-checkbox .sm-input-control-display:after {
    top: 2px;
    left: 5px;
    width: 2px;
    height: 6px;
    transform: rotate(45deg);
    border: solid #263849;
    border-width: 0 2px 2px 0;
}

/* Disabled tick colour */
.sm-input-control-checkbox input:disabled ~ .sm-input-control-display:after {
    border-color: #7b7b7b;
}

/* Radio button inner circle */
.sm-input-control-radio .sm-input-control-display:after {
    top: 7px;
    left: 7px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #263849;
}

/* Disabled circle colour */
.sm-input-control-radio input:disabled ~ .sm-input-control-display:after {
    background: #7b7b7b;
}

.month-picker {
    width: 250px;
    border: solid 2px black;
    display: flex;
}

.month-picker-container {
    display: inline-block;
}

.month-picker .year {
    width: 33.33%;
    display: inline-block;
    text-align: center;
    padding: 10px 0 10px 0;
    color: white;
    background-color: #263849;
    font-weight: bold;
}

.month-picker .nav {
    width: 33.33%;
    display: inline-block;
    text-align: center;
    padding: 10px 0 10px 0;
    font-weight: bold;
    color: white;
    background-color: #263849;
    cursor: pointer;
}

.month-picker .month {
    width: 33.33%;
    display: inline-block;
    text-align: center;
    padding: 10px 0 10px 0;
    cursor: pointer;
}

    .month-picker .month:hover {
        background-color: #ddd;
    }

    .month-picker .month.selected {
        font-weight: bold;
        color: white;
        background-color: #263849;
    }

div.date-picker {
    width: 250px;
    border: solid 2px black;
    display: flex;
}

.date-picker-container {
    display: inline-block;
}

.date-picker .month-year {
    width: 33.33%;
    display: inline-block;
    text-align: center;
    padding: 5px 0 5px 0;
    color: white;
    background-color: #263849;
    font-weight: bold;
}

.date-picker .nav {
    width: 33.33%;
    display: inline-block;
    text-align: center;
    padding: 5px 0 5px 0;
    font-weight: bold;
    color: white;
    background-color: #263849;
    cursor: pointer;
}

.date-picker .day-of-week {
    width: 13.27%; /* 1/7 */
    display: inline-block;
    text-align: center;
    padding: 5px 0 5px 0;
    font-weight:bold;
}

.date-picker .blank-day {
    width: 14.27%; /* 1/7 */
    display: inline-block;
    text-align: center;
    padding: 5px 0 5px 0;
}

.date-picker .day {
    width: 14.27%; /* 1/7 */
    display: inline-block;
    text-align: center;
    padding: 5px 0 5px 0;
    cursor: pointer;
}

    .date-picker .day:hover {
        background-color: #ddd;
    }

    .date-picker .day.selected {
        font-weight: bold;
        color: white;
        background-color: #263849;
    }

.file-input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

#video-details-panel p,
#picture-details-panel p {
    line-height: normal;
}

#video-details-panel p.header-label,
#picture-details-panel p.header-label {
    padding-top: 10px;
    line-height: 0px;
    font-weight: bold;
}

#proposal_detail .line-edit-actions > div {
    float:right;
}

#proposal_detail tbody td {
    vertical-align:top;
}

i.report-favorite {
    padding: 2px;
}

i.report-favorite:hover {
    background-color: #d0d0d0;
}

#gantt_gtl_D tr:nth-child(n+2) {
    height: 63px;
}

.gantt-task {
    height: 100%;
    display: block;
    overflow: hidden;
    border: solid black 2px;
    background-color: lightgray;
}

.gantt-task-wrapper {
    padding: 8px;
    color: black;
}

    .gantt-task-wrapper > * {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.gantt-task-title {
    font-weight: 600;
    font-size: 13px;
}

.gantt-task-row {
    font-size: 11px;
}

.gantt-task-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 6px;
    background-color: green;
}


/*
    DevExtreme DataGrid Formatting
*/

.dx-datagrid-content {
    font: 10pt SofiaProLightRegular,Helvetica,Arial !important;
}

.dx-sort-up::before {
    color: #959595;
    content: "\f0d8" !important;
    font: normal normal normal 14px/1 FontAwesome !important;
}

.dx-sort-down::before {
    color: #959595;
    content: "\f0d7" !important;
    font: normal normal normal 14px/1 FontAwesome !important;
}

.dx-datagrid-rowsview {
    overflow: auto !important;
}

.dx-data-row.dx-row-alt:not(.dx-selection) > td {
    background-color: inherit !important;
    border-bottom: 1px dotted #ddd !important;
}

.dx-datagrid-rowsview .dx-row {
    border-top: none !important;
    border-bottom: 1px dotted #ddd !important;
}

.dx-datagrid .dx-column-lines > td {
    border-left: 1px solid white !important;
    border-right: 1px solid white !important;
}

.dx-header-row td {
    background-color: #263849 !important;
    color: white !important;
    font-weight: bold !important;
}

.dx-datagrid-content > td {
    padding: 4px;
}

.dx-datagrid-filter-panel .dx-datagrid-filter-panel-clear-filter, .dx-datagrid-filter-panel .dx-datagrid-filter-panel-text {
    /* color: #337ab7 !important; */
    text-decoration: underline !important;
}

.dx-calendar-navigator .dx-calendar-caption-button.dx-button .dx-button-content {
    color: #263849 !important;
}

.dx-calendar-navigator-previous-month.dx-button .dx-icon, .dx-calendar-navigator-previous-view.dx-button .dx-icon, .dx-calendar-navigator-next-month.dx-button .dx-icon, .dx-calendar-navigator-next-view.dx-button .dx-icon {
    color: #263849 !important;
}

.dx-checkbox-icon {
    color: #263849 !important;
    border-width: 2px !important;
    border-color: #888 !important;
    border-radius: 0 !important;
}

.dx-checkbox-checked .dx-checkbox-icon::before {
    content: "" !important;
    background-color: #263849 !important;
    width: 100% !important;
    height: 100% !important;
    transform: scale(0.5) !important;
    top: 0 !important;
    left: 0 !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    border-radius: 0 !important;
}

.dx-checkbox-indeterminate .dx-checkbox-icon::before {
    content: "" !important;
    background-color: #337ab7 !important;
    width: 100% !important;
    height: 100% !important;
    transform: scale(0.5) !important;
    top: 0 !important;
    left: 0 !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    border-radius: 0 !important;
}

.dx-button {
    border-radius: 0 !important;
    border-color: silver !important;
    min-width: 0px !important;
}

    .dx-button .dx-button-content {
        border-radius: 0 !important;
        background-color: white !important;
        padding: 3px 8px 4px 8px !important;
        font: 12px "Segoe UI", Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif !important;
    }

        .dx-button .dx-button-content:hover {
            background-color: #0072C6 !important;
            color: white !important;
        }

/* MATCH FILTER PANEL ICON TO OLD STYLE
.dx-datagrid-filter-panel .dx-icon-filter {
    text-decoration: underline;
}

.dx-icon-filter::before {
    display: block;
    content: "" !important;
    background-image: url(/DXR.axd?r=0_2461-BIeUp) !important;
    background-repeat: !important;
    background-color: !important;
    background-position: -522px -84px !important;
    width: 14px !important;
    height: 14px !important;
}
*/
@media (min-width: 1000px) {
    #bulk-schedule-skip-options {
        margin-left: 225px;
    }
}

#bulk-schedule-skip-options ul {
    list-style-type: none;
}

#bulk-schedule-skip-options ul li {
    margin-top: 4px;
}

#bulk-schedule-skip-options input[type=text] {
    width: 30px;
}

.bottom-button-bar-spacer {
    height: 50px;
    clear: both;
}