/*
Connection Card Base Styles 
New v1.0.6
Contains all base styles to be used in all parts of system.

Should also create 
ccnew_kiosk_styles.css - contains ONLY kiosk specific styles 
ccnew_admin_styles.css - contains ONLY admin specific styles, but likely not many
ccnew_pos_styles.css - contains ONLY the POS styles 
*/

/*
Connection Card Brand Colours
*/ 

:root{
	--cc-primary: #0072bb;
	--cc-secondary: #5693b9;
	--cc-light-accent: #3bbeef;
	--cc-dark-accent: #0b3142;
    --brown: #8d5d25;
}


html {
	min-height:100%;
}
body {
	background-color: #EEEEEE;
	margin:0px;
	padding:0px;
	min-height:100%;
}

table.admintable{
	border-color:#EEEEEE;
	border-style:solid;
	border-width:1px;
}

.supporting-label-text {
    letter-spacing: 0.08rem;
    text-transform: uppercase;
    color: var(--gray);
    font-size: 0.85rem;
    padding-top: 0.15rem;
}

.top-bubble{
	width: 50%; 
	position: absolute; 
	left: 15%; 
	text-align: center; 
	border-bottom-left-radius: 10px; 
	border-bottom-right-radius: 10px;
}

.noHighlight{-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
TR.headerClass TD{
	/*background-color:#F2EEDB;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	height:22px;
	font-weight:bold;*/
	background-color:#FFFFFF;
	font-size:16px;
	border-top:0;
	border-bottom:1px solid #000000;
	vertical-align:bottom;
	padding-bottom:4px;
	height:38px;
	font-weight:bold;
}

TR.headerClassLetterPress TD{
	background-color:#606060;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	height:45px;
	font-weight:bold;
	vertical-align:middle;
	color:#111111;
	font-family: Tahoma, Helvetica, Arial, Sans-Serif;
	font-weight: bold;
	font-size: 18px;
}

/*************************************
/******      IMAGES    ***************
/***********************************/

.circle-image {
  clip-path: circle(80px at center);
  border-radius: 50%;
}

/*  BEGIN NEW ADD v1.0.6 */

/*************************************
/****   HEADER NAV BAR    ************
/************************************/

.navbar {
	left: 0;
	margin: 0;
	width: 100%;
	top:0;
	background-color:#091D3B;
	color: white;
}

/*************************************
/****    LEFT SIDE NAVIGATION ********
/************************************/

/* The side navigation menu */
.sidenav {
	min-height: 100vh;
    height:100vh; 
    width: 250px; 
    position: absolute; 
    z-index: 1;
    top: 0; 
    left: 0;
    background-color: #091D3B;
    overflow-x: visible; 
    padding-top: 60px; 
    transition: 0.5s; 	
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 14px;
    color: white;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #C7C7C7;
}
	
.sidenav-header {
	text-align: center;
}

.sidenav-header p {
	color: white;	
	font-size: 12px;
	padding-top: 5%
}

.sidenav-header a{
	font-size:12px;
	display:inline;
	padding:0;
}

.sidenav-open {
	font-size: 40px;
	width: 80px;
}	

/* Dropdown menu and elements included */
.card-header{
	border: none;
	border-bottom: 1px solid #E6E6E6;
}

.card {
	border-radius: 0px;
	background-color: white;
	text-decoration: none;
	border: none;
}
.card-header:hover {
	background-color: #EDEDED;
}

.cc-nav-btn{
	color: #404040;
}
.cc-nav-btn:hover {
	color: #404040;
	text-decoration: none;
}

.card-body a {
	padding: 2px;
	color:#000000;
}
	
/**********************************
/******     PAGE MAIN CONTENT *****
/********************************/

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding: 20px;
	margin-left:250px;
	padding-top:110px;
}

@media print { 
	#main{
		margin-left:10px !important;
		padding-top:10px !important;
	}
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}

/************************************
/*******    PAGE / VIEW    *********
/********************************* */

/* Page / View Specific - Across the board  */

.cc-page-wrap {
	max-width: 100vw;
}

.cc-page-header {
	border-bottom: 1px solid #CECECE;
	margin-bottom: 15px;
	padding: 20px;
	padding-right: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
}

.cc-page-header h1{
	font-size: 30px;
}

.cc-page-header p{
	font-size: 12px;
}

/**********************************
/*****      FOOTER      ***********
/********************************/	

#main {
	min-height: 90vh;
	padding-bottom: 100px;
	position: relative;
}

.footer {
	bottom: 0;
	font-size: 11px;
	height: 150px;
	color: #848484;
	border-top: 1px solid #D3D3D3;
	text-align: center;
	margin-left: 250px;
	
}
.footer-btns a {
	color: black;
	font-size: 13px;
	text-decoration: none;
}
	
/**********************************
/*****    LOADING SPINNER  *******
/********************************/	

.cc-loading-spinner {
	display: none;
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    position: absolute;
	left: 50%;
  	top: 50%;
  	z-index: 30000;
  	width: 150px;
  	height: 150px;
  	margin: -75px 0 0 -75px;;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
	
.cc-loading-overlay {
    background: #e9e9e999;  
    display: none;       
    position: absolute;   
    top: 0;              
    right: 0;               
    bottom: 0;
    left: 0;
    /*opacity: 0.5;*/
	min-height: 100vh;
	min-width: 100vw;
	z-index:20000;
}

.cc-loading-message{
	position: absolute;
    height: 160px;
    background: #000000;
    left: 0;
    right: 0;
    color: white;
	top:0;
    margin-top: 40vh;
    z-index: 25000;
    opacity: 0.7;
    text-align: center;
    padding: 40px;
}

/*************************************
/***    TABLE STYLES     *************
/********************************** */

/* Table Style 1 - table_list */

table.table_list{
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	padding:0px;
	font-size:1em;
	border-collapse:collapse;	
}

table.table_list tr{
	border-top:1px solid #eaeaea;
}

table.table_list tr:nth-child(even){
	background:#ffffff;
}

table.table_list tr:nth-child(odd){
	background:#fcfbf7;	
}

table.table_list tr:hover{
	background:#99c1dd;
}

table.table_list tr:first-child{
	border-top:0;	
}

table.table_list th{
	font-weight:bold;
	background-color:#F2EEDB;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	min-width:50px;
	text-align:left;
}

table.table_list td{
	padding:5px;
	height:40px;
}

.table_list_smaller{
	font-size:0.9em;
}

table.table_list{
	
}

table.table_list input[type="checkbox"]:before{
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    border: 1px solid #808080;
    content: "";
    background: #FFF;
}
table.table_list input[type="checkbox"]:after{
    position: relative;
    display: block;
    left: 2px;
    top: -20px;
    width: 16px;
    height: 16px;
    border-width: 1px;
    border-style: solid;
    border-color: #B3B3B3 #dcddde #dcddde #B3B3B3;
    content: "";
    background-image: linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
    background-repeat: no-repeat;
    background-position:center;
}
table.table_list input[type="checkbox"]:checked:after{
    background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAQAAABuW59YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAB2SURBVHjaAGkAlv8A3QDyAP0A/QD+Dam3W+kCAAD8APYAAgTVZaZCGwwA5wr0AvcA+Dh+7UX/x24AqK3Wg/8nt6w4/5q71wAAVP9g/7rTXf9n/+9N+AAAtpJa/zf/S//DhP8H/wAA4gzWj2P4lsf0JP0A/wADAHB0Ngka6UmKAAAAAElFTkSuQmCC'), linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
}
table.table_list input[type="checkbox"]:disabled:after{
    -webkit-filter: opacity(0.4);
}
table.table_list input[type="checkbox"]:not(:disabled):checked:hover:after{
    background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAQAAABuW59YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAB2SURBVHjaAGkAlv8A3QDyAP0A/QD+Dam3W+kCAAD8APYAAgTVZaZCGwwA5wr0AvcA+Dh+7UX/x24AqK3Wg/8nt6w4/5q71wAAVP9g/7rTXf9n/+9N+AAAtpJa/zf/S//DhP8H/wAA4gzWj2P4lsf0JP0A/wADAHB0Ngka6UmKAAAAAElFTkSuQmCC'), linear-gradient(135deg, #8BB0C2 0%,#FFF 100%);
}
table.table_list input[type="checkbox"]:not(:disabled):hover:after{
    background-image: linear-gradient(135deg, #8BB0C2 0%,#FFF 100%);  
    border-color: #85A9BB #92C2DA #92C2DA #85A9BB;  
}
table.table_list input[type="checkbox"]:not(:disabled):hover:before{
    border-color: #3D7591;
}

.check_col{
	width:40px;
}

table.table_list tr.table_list_selected td{
	border-top:1px solid #eaeaea;
	background:#ffeeaa;	!important
}	

.hidden{
	display:none;
}

/*<< end table style 1 */

/* Table Style 2 - simple-table */

.cc-simple-table {
	background-color: white;
	font-family: "Helvetica";
	color: #1F1F1F;
	min-width: 100%;
	max-width: 100%;
	border-spacing: 0;
}

.cc-simple-attr
{
	
}

.cc-simple-table-hidden,.cc-simple-attr-hidden{
	display:none;	
}

.cc-simple-table table, .cc-simple-table th, .cc-simple-table td {
	border: solid 1px #E5E5E5;
}

.cc-simple-table th {
	text-align: left;
	background-color: white;
	color: #1F1F1F;
	padding-left: 5px;
	padding: 10px;
}
/*
.cc-simple-table tr:nth-child(even) {
	background-color: #F2F2F2;
	
}
.cc-simple-table tr:nth-child(odd) {
	background-color:#FCFCFC;
	
}
*/
.cc-simple-table tr:nth-of-type(even) {
	background-color: #F2F2F2;
}
.cc-simple-table tr:nth-of-type(odd) {
	background-color:#FCFCFC;
}
.cc-dark{
	background-color: #F2F2F2 !important;
}
.cc-light{
	background-color:#FCFCFC !important;
}


.cc-simple-table td {
	padding-left: 10px;
	height:30px;
} 

.first-col-right tr td:nth-child(1){
	text-align:right;	
}


/*<< end table style 2 */

/* HINT BOXES - Which apply to Table Classes */

.cc-hint-box{
	/*display:none;*/
	visibility:hidden;
	z-index: 10;
}

.cc-simple-table tr div.cc-hint-box{
	background:rgba(33,33,33,0.7);
	border:1px solid #000000;
	display:inline;
	visibility:hidden;
	color:#ffffff;
	width:600px;
	padding:10px;
	margin-left:10px;
	/*position:relative;
	top:0px;
	left:-200px;*/
	position:absolute;
	opacity:0;
	-webkit-transition: opacity 0.5s; /* Safari */
	transition: opacity 0.5s;
}

.cc-simple-table tr:hover div.cc-hint-box{
	/*display:block;*/
	visibility:visible;
	opacity:100;
	-webkit-transition: opacity 0.5s; /* Safari */
	transition: opacity 0.5s;
}

/***********************************
/***   BOOTSTRAP/WYSIWYG EDITOR  **
/*********************************/

#editor {
	max-height: 250px;
	height: 250px;
	background-color: white;
	border-collapse: separate; 
	border: 1px solid rgb(204, 204, 204); 
	padding: 4px; 
	box-sizing: content-box; 
	-webkit-box-shadow: rgba(0, 0, 0, 0.0745098) 0px 1px 1px 0px inset; 
	box-shadow: rgba(0, 0, 0, 0.0745098) 0px 1px 1px 0px inset;
	border-top-right-radius: 3px; border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px; border-top-left-radius: 3px;
	overflow: scroll;
	outline: none;
}
#voiceBtn {
  width: 20px;
  color: transparent;
  background-color: transparent;
  transform: scale(2.0, 2.0);
  -webkit-transform: scale(2.0, 2.0);
  -moz-transform: scale(2.0, 2.0);
  border: transparent;
  cursor: pointer;
  box-shadow: none;
  -webkit-box-shadow: none;
}

div[data-role="editor-toolbar"] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dropdown-menu a {
  cursor: pointer;
}

/************************************
/*******      BUTTONS    *********
/********************************* */

/* Green Add New Button */
.cc-new-btn {
	font-family: "Helvetica";
	font-size: 14px;
	background-color: #3BBC31;
	padding: 9px;
	color: #F4F4F4;
	border: 1px solid #2AB740;
	border-radius: 4px;
	float:right;
}

/*  END NEW ADD v1.0.6 */

.tinyButton
{
    /*background: #F7F5EA;
    border: solid 1px grey;
    font-size: 90%;
    padding: 1px;
    cursor: pointer;*/
	
	/*background: #F7F5EA;
    border: solid 1px grey;
    font-size: 0.9em;
    padding: 3px;
    cursor: pointer;
	margin:3px;
	*/
	
	background:#ffffff;
    border: solid 1px #1F75D4;
	/*color:#1F75D4;*/
	color:#444444;
    font-size: 0.9em;
    padding: 3px;
    cursor: pointer;
	margin:3px;
	border-radius:3px;
	
}

.tinyButton:hover
{
	/*background: #444444;*/
	background:#0072bb;
	color:#FFFFFF;  
    cursor: pointer;
}

.buttonRed{/*background: #FFDDDD;*/
border-color:#DD3333;
color:#DD3333;
}
.buttonGreen{background: #DDFFDD;
color:#008613;
border-color:#008613;}
.buttonLightYellow{background: #FFFFDD;}
.buttonYellow{background: #FFFF00;}

.buttonRed:hover{background: #DD3333;
color:#ffffff;}
.buttonGreen:hover{background: #33DD33;}
.buttonLightYellow:hover{background: #FFFFDD;}
.buttonYellow:hover{background: #FFFF00;}


/* PERSONS LIST - SIDEBAR AND TABLE ALIGNMENT */
.table-container    {
    width: 90%;
    height: 100%;
	float: left;
	
}

.person-list-wrap {
	min-width: 80vw;
	max-width: 80vw;
}

/* INPUT AND SELECT BOX ADJUSTMENTS FOR MODALS */
.modal input, .modal select, .modal textarea{
	padding: 10px;
	margin: 5px;
	margin-left: 10px;
	margin-right: 10px;
	width: 95%;
}

/* SELECT BOX FIX FOR MAC CHROME */
.modal select{
    /*-webkit-appearance: none;*/
}

/* BLUE WRAP AROUND EACH PAGE - TO GET RID OF ?*/ 
.page_pre_table{
	width:95%;
	border:0;
	border-spacing:0px;
}
.page_pre_container{
	 height:87px;
}
.page_post_bottom{
	 height:43px;
	 background:#091D3B; /*#336699;*/
}
/*BLUE WRAP ABOVE*/

/*ANY TABLE USED INSIDE OF A CC_PAGE PAGE - TO GET RID OF ?*/
.page_table{
	background:#ffffff;
}

TR.rowA TD{
	background-color:#fcfbf7;
	border-top:1px solid #eaeaea;
	height:22px;
}
TR.rowB TD{
	background-color:#FFFFFF;
	border-top:1px solid #eaeaea;
	height:22px;
}
TR.rowBTop TD{
	background-color:#FFFFFF;
	height:22px;
}
TR.rowATop TD{
	background-color:#fcfbf7;
	height:22px;
}

TR.row1 TD{background-color:#ff6666;height:22px;}
TR.row2 TD{background-color:#ffcc66;height:22px;}
TR.row3 TD{background-color:#ffff66;height:22px;}
TR.row4 TD{background-color:#99ff66;height:22px;}
TR.row5 TD{background-color:#99cccc;height:22px;}
TR.row6 TD{background-color:#cc99cc;height:22px;}
TR.rowLine TD{border-top:1px solid #eaeaea;}
TR.rowWarnRed TD{background-color:#ffcccc;height:22px;}
TR.rowWarnYellow TD{background-color:#ffffcc;height:22px;}

/*.stulist tr:hover{
	background:#4B5B70
}*/

TR.double TD{
	height:40px;
	vertical-align:middle;
}

table.crew_calendar tr td{
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

table.crew_calendar{
	outline:solid 1px;
	outline-color:#000000;
	width:100%;
	outline-offset:-1px;
}

table.crew_calendar th{
	background-color:#091D3B;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	color:#FFFFFF;
}

tr.crew_calendar_days_header td{
	background-color:#f2eedb;
	font-size:12px;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	border-bottom:1px solid #000000;
}

tr.crew_calendar_days td{
	border:1px solid #eaeaea;
	text-align:left;
	vertical-align:top;
	padding-top:5px;
	height:80px;
	min-width:14%;
	max-width:15%;
}

tr.crew_calendar_daysWide td{
	border:1px solid #eaeaea;
	text-align:left;
	vertical-align:top;
	height:80px;
	width:14.2%;
	font-weight:normal;
}

table.crew_calendar tr:nth-of-type(even){
	background-color:#fcfbf7;
}
table.crew_calendar tr:nth-of-type(odd){
	background-color:#ffffff;
}

TR.rightBorder{border-right:1px solid #eaeaea;}
TD.rightBorder2{border-right:1px solid #eaeaea;}
TD.leftBorder{border-left:1px solid #eaeaea; padding-left:5px;}
TD.leftBorder2{border-left:1px solid #eaeaea;}
TR.bottomBorder TD{border-bottom:1px solid #eaeaea;}

div.print_report{
	width:100%;
	text-align:right;
}

div.facebook_like{
	width:350px;
	position:absolute;
	top:122px;
	right:2px;
	height:80px;
	z-index:10;
}

div.detaildiv{
	width:420px;
	background-color:#ffffff;
	border:1px solid #000000;
	position:absolute;
	display:none;
}
div.mainbod{
	left:0px;
	top:0px;
	position:relative;
}
div.bodwrap{
	margin:5%;
	width:90%;
	padding:12px 0px 12px 0px;
	background-color:#6699CC;
}
div.bodtext{
	width:94%;
	margin:0px 3% 0px 3%;
	background-color:#ffffff;
	top:10px;
}

input.group_admin_input{
	width:160px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	height:16px;
	border:1px solid #cccccc;
}
input.group_admin_button{
	background:#dddddd;
	border: solid 1px grey;
    font-size: 12px;
    padding: 2px;
    cursor: pointer;
}
	
div.group_admin_login{
	width:400px;
	right:50px;
	position:absolute;
	top:8px;
	height:70px;
	z-index:25;
	font-size:10px;
	color:#ffffff;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	border:1px solid #cccccc;
}

ul.itemdesc{
	margin-left:0px;
	padding-left:0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	list-style-position:inside;
}

li.itemdesc{
	margin:1px;
	padding:0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
}

div.listSortOptions{
	background-color:#DDEEEE;
	border-color:#000000;
	border-style:solid;
	border-width:1px;
	width:90%;
}

.listSortOptionsTH{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
}

.listSortOptions{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:normal;
}
div.head {
	background-color:#091D3B; /*#336699;*/
	width:100%; 
	height:120px;
}	
#ccard-logo{
	background-image:url(../img/ConnectionCard_Logo2014_v01_Web.gif);
	background-position:left;
	display:block;
	height:120px;
	width:339px;
	text-indent:-9999px;
}
div.headerLogo{
	width:339px;
	float:left;
}
div.headerQuickScan{
	width:220px;
	float:left;
}
div.headerMenu{
	width:400px;
	height:25px;
	/*margin-top:95px;*/
	text-align:right;
	/*margin-right:20px;*/
	top:95px;
	right:20px;
	position:absolute;
	/*float:right;*/
	color:#FFFFFF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	z-index:100;
}
div.loggedMenu{
	width:300px;
	height:80px;
	margin-top:40px;
	text-align:right;
	margin-right:20px;
	float:right;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
}
.foot a:link {color:#FFFFFF; text-decoration:none;}
.foot a:visited {color:#FFFFFF; text-decoration:none;}
.foot a:active {color:#FFFFFF; text-decoration:none;}
.foot a:hover {color:#66CCFF; text-decoration:none;}
.loggedMenu a:link {color:#FFFFFF; text-decoration:none;}
.loggedMenu a:visited {color:#FFFFFF; text-decoration:none;}
.loggedMenu a:active {color:#FFFFFF; text-decoration:none;}
.loggedMenu a:hover {color:#66CCFF; text-decoration:none;}
.headerMenu a:link {color:#FFFFFF; text-decoration:none;}
.headerMenu a:visited {color:#FFFFFF; text-decoration:none;}
.headerMenu a:active {color:#FFFFFF; text-decoration:none;}
.headerMenu a:hover {color:#66CCFF; text-decoration:none;}
.whiteLink a:link {color:#FFFFFF; text-decoration:none;}
.whiteLink a:visited {color:#FFFFFF; text-decoration:none;}
.whiteLink a:active {color:#FFFFFF; text-decoration:none;}
.whiteLink a:hover {color:#66CCFF; text-decoration:none;}
.whiteLink{
	color:#ffffff;
}
div.container{
	min-height:100%;
	position:relative;
	/*margin:0 auto -135px;*/
	<!--[if IE 6]>
	height:100%;
	<![endif]-->
}
div.profile_container{
	min-height:100%;
	position:relative;
}
div.foot {
	background-color:#091D3B;
	width:100%; 
	height:125px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#FFFFFF;
	bottom:0;
}
div.foot_profile {
	background-image:url(../img/foot.gif); 
	background-repeat:no-repeat; 
	background-position:bottom;
	bottom:0px;
	width:100%; 
	height:125px;
}
div.bod {
	margin:10px;
	padding:30px;
	min-height:65vh;
	padding-bottom:50px;
}

div.profile_bod_wrapper {
	margin:0px 10px 0px 10px;
	position:relative;
	height:820px;
}

div.profile_navbar{
	/*background-color:#31659C;*/
	width:200px;
	border-right:1px solid #dddddd;
	height:800px;
	top:20px;
}

div.profile_navigation{
	width:100%;
	position:relative;
}

div.profile_nav_balances{
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}

.profile_balances_headers{
	font-size:11px;
	color:#555555;
	text-align:center;
	text-transform:uppercase;
}
.profile_balances_headers a:link, .profile_balances_headers a:visited, .profile_balances_headers a:active{color:#555555; width:190px; height:110%; text-decoration:none; display:inline-block; padding:2px 0px 2px 2px; margin:0px;}
.profile_balances_headers a:hover{color:#555555; width:190px; height:110%; background-color:#cceeff; text-decoration:none; display:inline-block; padding:2px 0px 2px 2px; margin:0px;}

.profile_balances_text{
	font-size: 11px;
}

.profile_crews_text{
	font-size: 11px;
}

.profile_body_text{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
}

.profile_body_header{
	font-size:12px;
	text-transform:uppercase;
	color:#555555;
}
div.profile_popup_container{
	position:absolute;
	width:100%;
	left:0px;
	top:100px;
	height:400px;
	text-align:center;
	vertical-align:top;
}
div.profile_payment_popup{
	background-color:#ffffff;
	width:30%;
	left:35%;
	top:0px;
	border:3px solid #66ccff;
	min-height:100px;
}



.profile_crews_text a:link, .profile_crews_text a:visited, .profile_crews_text a:active{padding:5px 0px; display:inline-block; vertical-align:middle;}

/*img.profile_crews_iconA_1,img.profile_crews_iconA_2,img.profile_crews_iconA_3,img.profile_crews_iconA_4,img.profile_crews_iconA_5,img.profile_crews_iconA_6,img.profile_crews_iconB_1,img.profile_crews_iconB_2,img.profile_crews_iconB_3,img.profile_crews_iconB_4,img.profile_crews_iconB_5,img.profile_crews_iconB_6{width:16px; height:16px;}*/
.profile_crews_iconA_1{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:0 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_1{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:0 0; border-style:none; border-width:0px;}
.profile_crews_iconA_2{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-16px 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_2{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-16px 0; border-style:none; border-width:0px;}
.profile_crews_iconA_3{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-32px 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_3{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-32px 0; border-style:none; border-width:0px;}
.profile_crews_iconA_4{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-48px 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_4{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-48px 0; border-style:none; border-width:0px;}
.profile_crews_iconA_5{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-64px 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_5{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-64px 0; border-style:none; border-width:0px;}
.profile_crews_iconA_6{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-80px 15px; border-style:none; border-width:0px;}
.profile_crews_iconB_6{width:16px; height:16px;background-image:url('../img/admin/crews_sprite.gif'); display:inline-block; background-position:-80px 0; border-style:none; border-width:0px;}
div.profile_crew_link_divs{height:16px; display:inline-block; vertical-align:top; padding-top:1px; padding-left:2px;}

div.alert_error{
	width:50%;
	border-style:solid;
	border-color: #FF0000;
	border-width: 1px;
	background-color:#FFCCCC;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	padding:15px;
	border-radius:10px;
}

div.alert_confirm{
	width:50%;
	border-style:solid;
	border-color: #00DD00;
	border-width: 1px;
	background-color:#CCFFCC;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	vertical-align:middle;
	padding:15px;
	border-radius:10px;
}

div.alert_info{
	width:50%;
	border-style:solid;
	border-color: #000000;
	border-width: 1px;
	margin:auto;
	margin-top:50px;
	background-color:#DDDDDD;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	vertical-align:middle;
	padding:15px;
	border-radius:10px;
}

a.alert_error_btn_red,a.alert_error_btn_gray{
	display:inline-table;
	width:100px;
	height:25px;
	margin-top:20px;
	margin-left:10px;
	border-radius:5px;
	border:1px solid #000000;
	vertical-align:middle;
	color:#000000;
	font-size:16px;
	font-style:normal;
	font-variant:normal;
	text-decoration:none;
}

a.alert_error_btn_red{
	background:#ffbbbb;
}

a.alert_error_btn_gray{
	background:#dddddd;
}

div.profile_body{
	background-color:#FFFFFF;
	width:57%;
	position:absolute;
	top:5px;
	float:right;
	margin-left:50px;
	left:202px;
}

div.profile_adbar{
	/*background-color:#3399CC;*/
	width:200px;
	border-left:1px solid #dddddd;
	position:absolute;
	right:0px;
	top:20px;
	height:800px;
}

.profile_adbar_images{
	border:1px solid #000000;
}

div.topmain{
	width:100%; 
	background-color:#336699;
}
div.topMenu{position:absolute; top:120px; left:0px; color:#FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; z-index:10; text-align:center; background-color:#324143; height:26px; font-size:10px; width:100%; }
/*div.topmenu{
	width:100%; 
	background-color:#336699;
	position:absolute;	top:150px; left:0px; color:#FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; z-index:10;
}*/
div.mapwindow{
	position:absolute;
	left:100px;
	top:350px;
	width:500px;
	height:430px;
	background-color:#FFFFFF;
	border-color:#000000;
	border:2px;
	display:none;
	border-style:solid;
	border-width:2px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}

div.profile_fnc_wrapper{
	background-color:#EEEEEE;
	position:relative;
	border-style:solid;
	border-color:#CCCCCC;
	border-width:1px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}
div.profile_fnc_control{
	position:absolute;
	top:0px;
	right:0px;
	width:100px;
}
div.profile_fnc{
	background-color:#FFFFFF;
	vertical-align:middle;
}

div.profile_glomsg_wrapper{
	background-color:#99EE77;
	position:relative;
	display:block;
	height:50px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}

div.profile_events_wrapper{
	background-color:#EEEEEE;
	position:relative;
	border-style:solid;
	border-color:#CCCCCC;
	border-width:1px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}

div.hiddenDiv{
	position:absolute;
	display:none;
}

div.hiddenDivTest{
	position:absolute;
	width:600px;
	background-color:#FFFFFF;
}

.camp_smallNotice{font-family:Verdana, Arial, Helvetica, sans-serif; color:#ff0000; font-size:11px;}
.camp_normal{font-family:Verdana, Arial, Helvetica, sans-serif; color:#000000; font-size:12px;}
.camp_bold{font-family:Verdana, Arial, Helvetica, sans-serif; color:#000000; font-size:13px; font-weight:bold;}
.camp_error{font-family:Verdana, Arial, Helvetica, sans-serif; color:#ff0000; font-size:12px; font-weight:bold;}

div.popupWindowSmall{
	position:absolute;
	width:500px;
	height:200px;
	background-color:#EEEEEE;
	border-color:#006699;
	border-style:double;
	border-width:2px;
	display:none;
}

div.popupWindowSmallTest{
	position:absolute;
	width:500px;
	height:200px;
	background-color:#EEEEEE;
	border-color:#006699;
	border-style:double;
	border-width:2px;
}

div.frameControl{
	position:absolute;
	right:2px;
	top:2px;
}

div.profile_events_control{
	position:absolute;
	top:0px;
	right:0px;
	width:100px;
}
div.profile_events{
	background-color:#FFFFFF;
	vertical-align:middle;
}

div.profile_feed_wrapper{
	background-color:#EEEEEE;
	position:relative;
	border-style:solid;
	border-color:#CCCCCC;
	border-width:1px;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 14px;
}
div.profile_feed_control{
	position:absolute;
	top:0px;
	right:0px;
	width:100px;
}
div.profile_feed{
	background-color:#FFFFFF;
	vertical-align:middle;
	padding:0px 20px;
}


.topmenu a:link {color:#FFFFFF; text-decoration:none;}
.topmenu a:visited {color:#FFFFFF; text-decoration:none;}
.topmenu a:active {color:#FFFFFF; text-decoration:none;}
.topmenu a:hover {color:#66CCFF; text-decoration:none;}

.image_link a:link { color:#000000; text-decoration:none;}
.image_link a:visited { color:#000000; text-decoration:none;}
.image_link a:active { color:#000000; text-decoration:none;}
.image_link a:hover { color:#000000; text-decoration:none;}

.controlpanel a:link { text-decoration:none;}
.controlpanel a:visited { text-decoration:none;}
.controlpanel a:active { text-decoration:none;}
.controlpanel a:hover { text-decoration:none;}

.topmenu {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#FFFFFF; }
.subheaders {font-family: Verdana, Arial, Helvetica, sans-serif}
.style2 {font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
.invert {color: #FFFFFF}
.normal {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
.emboss {text-shadow: 0px 2px 2px #777777;}
.shadow {text-shadow: 0px 1px 4px #EEEEEE;}
.itemdescripts {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }
.errortxt {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FF0000;
	font-weight: bold;
}
.reg_headers {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
}
.reg_items {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; }
.ccWebHeader {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
}
.ccWebNormal {font-family: Verdana, Arial, Helvetica, sans-serif}
.ccWebError {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FF0000;
}
.ccWebDescription {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }
div.sitemainalert{
	width:100%; 
	background-color:#FFFF00;
}
.sitemainalert{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
}
div.sitemaindown{
	width:100%; 
	background-color:#FF6666;
}
.sitemaindown{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
}

/* menu styles */
.clear
	{	clear: both;
		overflow: hidden;
		height: 0}
		
#jsddm
{	margin: 0;
	padding: 0}

	#jsddm li
	{	float: left;
		list-style: none;
		font: 12px Tahoma, Arial}

	#jsddm li a
	{	display: block;
		background: #324143;
		padding: 5px 12px;
		text-decoration: none;
		border-right: 1px solid white;
		width: 90px;
		color: #EAFFED;
		white-space: nowrap}

	#jsddm li a:hover
	{	background: #24313C}
		
		#jsddm li ul
		{	margin: 0;
			padding: 0;
			position: absolute;
			visibility: hidden;
			border-top: 1px solid white}
		
			#jsddm li ul li
			{	float: none;
				display: inline;
				text-align:left}
			
			#jsddm li ul li a
			{	width: auto;
				background: #A9C251;
				color: #24313C}
			
			#jsddm li ul li a:hover
			{	background: #8EA344}
			
/* NEW STYLES ADDED 2018 FOR REVAMP CCBRAYDEN */
.textbox {
	 border: 5px solid white; 
    -webkit-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    padding: 8px;
    background: #F5F5F5;
    margin: 0 0 10px 0;	
}

.mini_form_input {
	 border: 5px solid white; 
    -webkit-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    padding: 8px;
    background: #F5F5F5;
    margin: 0 0 10px 0;	
	height: 50px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

.mini_form_btn {
	font-size: 14px;
	margin-left: 10px;
	margin-bottom: 9px;
	padding: 8px;
	background-color: #2D2D2D;
	color: white;	
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.mini_form_btn:hover {
	background-color: #EDEDED;
	color: black;	
}

.mini_form_container {
	color: #353535;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.mini_form_container h2{
	padding: 10px;
	margin: 0;
}

.mini_form_container table{
	padding: 10px;
}

.sectionheader {
	
	font-size: 24px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	padding: 8px;
	font-weight: 500;
	color: #353535;
}

.sectioncontent {
	color: #353535;
	text-align: center;
	padding: 10px;
	padding-top: 20px;
	background-color: #F5F5F5;
	min-height: 140px;
	max-height: 140px;
	width: 200px;
	float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
	font-size: 20px;
	font-weight: 500;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.sectioncontent a{
	color:#000000;
	text-decoration:none;
}

.sectioncontent:hover {
	background-color: #1060DC;
	-webkit-transition: background .2s;
	color: white;
}

.sectioncontentright {
	font-size: 18px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.line {
	border: solid #F5F5F5 1px;
	marign: 0;
}

tablefill {
	background: white;
    border-radius: 6px;
    border-collapse: collapse;
    max-width: 800px;
    padding: 5px;
    width: 100%;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}
.tablefill tr:hover td {
  background:#262626;
  color:#FFFFFF;
  border-top: 1px solid #22262e;
  border-bottom: 1px solid #22262e;	
}
.tablefill tr{
	border-top: 1px solid #C1C3D1;
  border-bottom-: 1px solid #C1C3D1;
  color:#4B4B4B;
  font-size:16px;
  font-weight:normal;
  text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
		
}

.tablefill td {
  background:#FFFFFF;
  padding:2px;
  text-align:left;
  vertical-align:middle;
  font-weight:300;
  font-size:18px;
  text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
  color: #4B4B4B
}

.tablefill th {
  color:white;
  background:#262626;
  font-size:23px;
  font-weight: 100;
  padding:14px;
  text-align:left;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  vertical-align:middle;
}
.tablefill tr {
	max-height: 10px;	
}

.tablefill tr:nth-child(even) {
	background: red; 
}


.medium{
	width:440px; !important
}

.long{
	width:680px; !important
}

.medium:hover,.long:hover {
	background-color: #D0D0D0; !important
	-webkit-transition: background .2s;
	color:#353535; !important
}

/* STYLES BEING ADDED MARCH 2018 */

.birthdays {
	background-color: #F5F5F5;
	padding: 10px;
	height: 900px;
	width: 270px;	
	float: right;
	font-family:'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', Verdana, sans-serif;
}


.page_body{
	max-width:1400px;
	margin:auto;
}

.page_body_header{
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 1.5em;
	font-weight:bold;
	margin-bottom:10px;	
}

table.table_input{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding:0px;
	font-size:0.9em;
	border-collapse:collapse;	
}

table.table_input tr{
	border-top:1px solid #eaeaea;
	height:22px;
}

table.table_input tr:nth-child(even){
	background:#ffffff;
}

table.table_input tr:nth-child(odd){
	background:#fcfbf7;	
}

table.table_input tr:hover{
	background:#99c1dd;
}

table.table_input tr:first-child{
	border-top:0;	
}

table.table_input th{
	font-weight:bold;
	background-color:#F2EEDB;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	min-width:50px;
	text-align:left;
}

table.table_input td{
	padding:5px;
	/*height:40px;*/
}

.table_input_smaller{
	font-size:0.9em;
}

.table_input input[readonly],.table_input input:read-only{
	background:#eeeedd;
	border:1px solid #444444;
}


.stuview_family_image{
	display:inline-block; 
	width:64px;
}
.stuview_family_name{
	display:inline-block;
	width:calc(100% - 98px);
}
.stuview_family_remove{
	display:inline-block;
	width:18px;
}

.site_container{
	margin:0;
	position:relative;
}


/* BEAN STATUS MESSAGE STYLES
Also duplicated in cc_kiosk_styles.css
Also duplicated in ccnew_base_profile_styles.css
*/

.BeanStatusMessage{
	width:400px; 
	padding:10px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.BeanStatusMessageTopAlert{
	margin:0;
	margin-left: -20px;
	margin-top: -15px;
	margin-right: -20px;
	padding:10px;
	font-size:14px;
	text-align:center;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.BSM-Error{
	background:#ffcccc; 
	border:1px solid #cc0000;
}

.BSM-Success{
	background:#ccffcc; 
	border:1px solid #00cc00;
}

.BSM-Alert{
	background:#ffffcc; 
	border:1px solid #aaaa00;
}

.BSM-Message{
	background:#cccccc; 
	border:1px solid #333333;
}

.BSM-Warning{
	background:#ffddcc; 
	border:1px solid #cc0000;
}

/* quick new item styles */

.quick-new-item fieldset {
	border: none;
	text-align: center;
}

.quick-new-item label{
	display: block;


}
.quick-new-item input{
	margin-right: 0;

}
.yescls {
	color: green;
	
}

.cancelcls {
	color: red;
}

