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

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
*/

/* HTML5 display-role reset for older browsers 
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

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

/*********************************
			layout
***********************************/

/*		Colors

	name			Value

Light Green:        #80DA34
Pale Orange:        #CB9C1C
Red:                #E34B48
Magenta:            #B71D9A
Purple:             #6632D9
Pale Blue:          #267CDC
Turqoise:           #23C89F

*/


/* KYLE

*/

/*		General stuff		*/
html{  }
/*body{ font-family:Arial, Helvetica, sans-serif; }
*/

body{
    background-color:#d6d6d6;

}

#wrapper{
	background-color:#d6d6d6;
}

.commuteTracker
{
    margin:0px auto;
    }

#overlay{
	display:none;
	position:fixed;
	top:0;
	left:0;
	height:100%;
	width:100%;
	background:rgba(0,0,0,.1);
	z-index:50;
}

.shareButton_wrapper
{
    float:right;
    position:relative;
    z-index:5;
    margin-top: 10px;
}
.shareButton
{
    
}

.pageContentTabSectionUnderTabs
{
    overflow:visible;
    min-height: 90px;
}


/*		info/edit windows		*/
.infoWindow, .editWindow
{
	position:absolute;
    top:0px;
    left:-9999px;
	display:block;
	width:350px;
	background:#fff;
	color:#333;
	border:2px solid #333;
	box-shadow:0px 0px 20px rgba(0,0,0,.5);
	z-index:200;
	
	border-radius:10px;
}

/*.editWindow{
	display:block;
	top:50px;
	left:100px;
}
*/	
	/*		Pop up title		*/
	.popUpTitleCommute{
		min-height:40px;
		color:#fff;
		border-top-left-radius:5px;
		border-top-right-radius:5px;
		background:url(/Images/CommuteTracker/titleHighlight.png) repeat-x scroll 50% 50% #333;
	}
	
		.popUpTitleCommute .icon{
			display:block;
			float:left;
			width:30px;
			height:30px;
			margin:7px 5px;
		}
		
		.popUpTitleCommute h3{
            vertical-align:middle;
			line-height:24px;
			font-size:18px;
			margin:0px;
            padding:8px;
		}
		
		.popUpTitleCommute .editClose, .popUpTitleCommute .infoClose{
			display:block;
			width:20px;
			height:20px;
			margin:10px;
			float:right;
			cursor:pointer;
		}
		.popUpTitleCommute .editClose:hover, .popUpTitleCommute .infoClose:hover{
			color:#c00;
		}
		
	/*		Pop up content		*/
	.popUpContent{
		padding:5px;
		font-size:12px;
		line-height:19px;
        position: relative;
	}
	    
	    .infoWindow .popUpContent table
	    {
	        width:320px;
	        margin:0px 10px;
	        }

	        .infoWindow .popUpContent tr
	        {
	            vertical-align:top;
	            }
	        
	        .popUpContent tr.tripDetailsTitle
	        {
	            cursor:pointer;
	            }
	            
	        .popUpContent tr.tripDetailsTitle td
	        {
	            font-weight: bold;
                text-align: center;
	            }
	                
	            .popUpContent tr.tripDetail
	            {
	                }
	            
	                
	        .infoWindow .popUpContent tr:nth-child(2n+5)
	        {
	            background:#ECECEC;
	            }

	            .infoWindow .popUpContent td
	            {
	                vertical-align:top;
	                white-space:nowrap;
	                padding:2px 5px;
	                }

	            .popUpContent td.infoItem
	            {
	                padding-left:5px;
	                white-space:normal
	                }

        .popUpContent .CommuteTrackerCommuteModeInstruction
        {
            padding:5px;
            background:#FFF0A0;
            border:1px solid #FFCD00;
            color:#9D4B31;
            border-radius:5px;
        }

        .CommuteTrackerOnlyOneTripWarning {
            margin-top: 5px;
            padding: 5px;
            background: #FFF0A0;
            border: 1px solid green;
            color: green;
            font-weight: normal;
            border-radius: 5px;
            padding-top: 4px;
            display: block;
        }

		.popUpContent .sectionFull
		{
		   /* position:relative; */
			padding:5px 5px 0;
			width:325px;
			clear:both;
		}
        
        .tripPurposeSection {
            display: block;
        }
	
		.popUpContent .sectionOneThird{
			padding:5px 5px 0;
			width:102px;
			float:left;
		}
				
		.popUpContent .sectionTwoThird{
			padding:5px 5px 0;
			width:210px;
			float:left;
		}
		
		.popUpContent .sectionHalf{
			padding:5px 5px 0;
			width:155px;
			float:left;
		}

        .CommuteTrackerAddressBarsSection
        {
            position:relative;
            z-index:2;
        }

		.popUpContent .tripItemMapRoute
		{
		    clear:both;
		    margin:5px 0;
            position:relative;
            z-index:1;
		    }
		
		.popUpContent .button{
			display:block;
			margin: 5px 10px;
			width:116px;
			float:left;
			text-align:center;
			color:#fff;
			background:url(/Images/CommuteTracker/titleHighlight.png) repeat-x scroll 50% 50% #333;
			line-height:16px;
			font-size:16px;
			text-decoration:none;
			
			border-radius:5px;
			
			box-shadow:
						1px 1px 0px rgba(255,255,255,.6) inset,
						-1px -1px 0px rgba(0,0,0,.3) inset,
						1px 1px 2px rgba(0,0,0,.6)
						;
						
		}
		.popUpContent .button:hover{ background-color:#666; }
		
		.popUpContent .button.itemDelete{ background-color:#a00; }
		.popUpContent .button.itemDelete:hover{ background-color:#C00; }
		
		.popUpContent .button.itemEdit{ background-color:#07a; }
		.popUpContent .button.itemEdit:hover{ background-color:#09c; }
		
		.popUpContent input[type=text]{
			display:block;
			width:100%;
		}

		.popUpContent textarea{
			display:block;
			width:99%;
			min-height:100px;
			line-height:110%
		}

		.popUpContent select{
			width:103%
		}
		
		.popUpContent label{
			display:block;
		}
		
		.commuteTracker .popUpContent h4{
			font-size:12px;
			color:#999;
			margin:10px 0;
		}
		
			.commuteTracker .popUpContent h4 .tripDistance{
				font-size:20px;
				font-weight:bold;
				color:#333;
			}
			
		.popUpContent .sectionDivider{
			width:100%;
			float:left;
			clear:both;
			height:10px;
		}
		
		.popUpContent .map{
			background:url(/Images/CommuteTracker/mapPlaceholder.jpg);
			height:200px;
			text-align:center;
			font-size:36px;
			line-height:75px;
			color:#fff;
			margin:0px 5px;
		}
		
		.popUpContent dl{
			font-size:16px;
			color:#999;
			
		}
		
		.popUpContent dt{
			font-weight:bold;
		}
				
		.popUpContent dd{
			color:#333;
			margin-bottom:10px;
		}
		
	/*		Pointers		*/
	.pointerBorder, .pointerWhite{
		position:absolute;
		top:70px;
		width:0; 
		height:0; 
		border-top:20px solid transparent; 
		border-bottom:20px solid transparent;
	}
	
	/* right positioned box	*/
	.positionRight .pointerBorder{
		border-right:20px solid #333; 
		left:-22px;
	}
	
	.positionRight .pointerWhite{
		border-right:20px solid #fff; 
		left:-19px;
	}
	
	/* left positioned box */
	.positionLeft .pointerBorder{
		border-left:20px solid #333; 
		right:-22px;
	}
	
	.positionLeft .pointerWhite{
		border-left:20px solid #fff; 
		right:-19px;
	}

/* END Info/Edit windows */

	
/* Should be #wrapper */
.centerPage{
	width:960px;
	margin:0px auto;
	padding:100px 0;
}

	#commuteTrackerSidebar, #calendarBox{
		float:left;
	}
	
	/*		Sidebar		*/
	#commuteTrackerSidebar{
		width:190px;
		margin:20px 6px 0px 0px;
        position:relative;
	}

        #commuteTrackerSidebar.ie7-drag-fix
        {
            z-index:98;
            position:relative;
        }
    
    
    .EditingDisabledMessage
    {
        display:none;
        }
        
    .EditingDisabledMessage p
    {
        color: #000000;
        font-size: 18px;
        font-weight: bold;
        line-height: 120%;
        margin: 20px;
        text-shadow: 0 0 5px #FFFFFF;
        }

	#commuteTrackerSidebar.disabled
	{
	    position:relative;
	    }

	#commuteTrackerSidebar.disabled .EditingDisabledMessage
	{
	    display:block;
	    position:absolute;
	    top:0px;
	    left:-3px;
	    width:102%;
	    height:100%;
	    background:rgb(255,255,255);
	    background:rgba(255,255,255,.87);
	    border-radius:5px;
	    z-index:300;
	    }    
    
    
    
    /* KYLE */
	.commuteTrackerSidebarTitle
	{
	    background-image: url('/Images/CommuteTracker/presetTitleBGLighter.png');
	    background-position: left center;
	    background-repeat:  no-repeat;
	    color:#e6e6e6;
	    padding-left: 5px;
	    padding-top:5px;
	    position: relative;
	    height:33px;
        z-index:99;
	}
		
    .commuteTrackerSidebarTitle h4 {
        display: block;
        font-size: 14px;
        font-style: italic;
        font-weight: bold;
        line-height: 19px;
        margin: 0 auto 15px;
        padding-left: 5px;
        padding-top: 5px;
		font-family: Verdana, Lucida Grande, Arial, Tahoma, sans-serif;
}
        
	
	span.travelModesSidebarTitle, span.travelModesSidebarTitleTwo
	{
	    font-size: 16px;
	    font-style: italic;
	    font-weight: bold;
	    margin: 0 auto;
	    /*margin-left:5px;*/
	    margin-bottom:10px;
	    display:block;
	    padding-top:5px;
	}
	
	.travelModesSidebarTitleTwo 
	{
	    margin-bottom: 10px;
	}
	/* /KYLE */
	
	    #tripItems, #presetItems
	    {
			margin-bottom:0px;
	        }

		#tripItems
		{
		      padding:0px 15px;
		    } 
		    
		#presetItems
		{
		    
		    }
		
		.tripItem, .presetItem{
			padding:0;
			z-index:98;
		}

.tripItem, .sortItem {
    float: left;
    height: 30px;
    width: 30px;
    padding: 0;
    margin: 3px;
    background: url(/Images/CommuteTracker/commuteTrackerSpriteV2.png) -1px -1px #333;
    z-index: 98;
    border-radius: 2px;
}
		.tripItem:hover, .sortItem:hover{
			box-shadow:0px 0px 4px rgba(0,0,0,.6),
				 inset 0px 0px 2px rgba(0,0,0,.4)
						;
		}
				
		.tripItem:hover{
			cursor:move;
		}
		
		.sortItem:hover{
			cursor:pointer;
		}
				
		/* trip item etc. coloring */
		/*			COLORS
			NAME			VALUE		
		Light Green:        #80DA34
		Pale Orange:        #CB9C1C
		Red:                #E34B48
		Magenta:            #B71D9A
		Purple:             #6632D9
		Pale Blue:          #267CDC
		Turqoise:           #23C89F
		*/
		
		/* Kyle's revised coloring*/
		/*
        dark blue: #3a4a9f;
        dark orange: #ff6600;
        dark green: #39b54a;
        */
				
		.Walk, #calendarBox .Walk{
			background-color:#6632D9;
			color:#6632D9;
			background-position:-5px -4px;
		}
		.Bike, #calendarBox .Bike{
			background-color:#ff6600;
			color:#ff6600;
			background-position:-5px -31px;
		}
		.DriveAlone, #calendarBox .DriveAlone{
			background-color:#b71d9a;
			color:#b71d9a;
			background-position:-5px -58px;
		}
		.Carpool, #calendarBox .Carpool{
			background-color:#39b54a;
			color:#39b54a;
			background-position:-8px -88px;
		}
		.Vanpool, #calendarBox .Vanpool{
			background-color:#23C89F;
			color:#23C89F;
			background-position:-7px -113px;
		}
		.TeleWork, #calendarBox .TeleWork{
			background-color:#3a4a9f;
			color:#3a4a9f;
			background-position:-7px -146px;
		}        
		.Transit, #calendarBox .Transit{
			background-color:#E34B48;
			color:#E34B48;
			background-position:-7px -176px;
		}		
		.TransitBus, #calendarBox .TransitBus{
			background-color:#E34B48;
			color:#E34B48;
			background-position:-7px -176px;
		}
		.TransitRail, #calendarBox .TransitRail{
			background-color:#e34b48;
			color:#e34b48;
			background-position:-7px -211px;
		}
		.TransitFerry, #calendarBox .TransitFerry{
		    background-color:#e34b48;
		    color:#e34b48;
		    background-position:-10px -242px;
		}
		/*.WaterTaxi, #calendarBox .WaterTaxi{
		    background-color:#e34b48;
		    color:#e34b48;
		    background-position:-10px -242px;
		}*/
		.Air,#calendarBox .Air{
		    background-color:#e34b48;
		    color:#e34b48;
		    background-position:-7px -272px;
		}
		.TransitAir,#calendarBox .TransitAir{
		    background-color:#e34b48;
		    color:#e34b48;
		    background-position:-7px -272px;
		}
        .AirTravelAvoided, #calendarBox .AirTravelAvoided {
            background-color: #ffb600;
            color: #ffb600;
            background-position: -7px -272px;
        }
		.SingleTaxi, #calendarBox .SingleTaxi{
			background-color:#000;
			color:#000;
			background-position:-7px -303px;
		}	
		.SharedTaxi, #calendarBox .SharedTaxi{
			background-color:#000;
			color:#000;
			background-position:-7px -333px;
		}	
		.OutOfOffice, #calendarBox .OutOfOffice{
			background-color:#29ABE2;
			color:#29ABE2;
			background-position:-7px -365px;
		}	
        .DayOff, #calendarBox .DayOff{
			background-color:#29ABE2;
			color:#29ABE2;
			background-position:-7px -400px;
		}
		.DayOffCompressedWeek, #calendarBox .DayOffCompressedWeek{
			background-color:#29ABE2;
			color:#29ABE2;
			background-position:-7px -433px;
		}
		.WaterTaxi, #calendarBox .WaterTaxi{
		    background-color:#29ABE2;
		    color:#29ABE2;
		    background-position:-7px -472px;
		}
		.DriveAloneZEV, #calendarBox .DriveAloneZEV{
		    background-color:#39b54a;
		    color:#39b54a;
		    background-position:-7px -511px;
		}
		.BrownBagLunch, #calendarBox .BrownBagLunch{
		    background-color:#af800b;
		    color:#af800b;
		    background-position:-7px -550px;
		}
		.OutOfRegion, #calendarBox .OutOfRegion{
		    background-color:#29abe2;
		    color:#29abe2;
		    background-position:-7px -590px;
		}
        .Carpool3Plus, #calendarBox .Carpool3Plus {
            background-color: #461360;
            color: #461360;
            background-position: -8px -625px;
        }
        .EScooter, #calendarBox .EScooter {
            background-color: #38a91c;
            color: #38a91c;
            background-position: -8px -670px;
        }

#CalendarInfoNote {
    margin-bottom: 5px;
    color: #777;
    width: 680px;
}

		
		/* Presets */
		#presetItems h4
		{
		    /*
			line-height:1.5;
			font-weight:bold;
			background:#FFF;
            */		
        }
		
		.presetItem{
			cursor:move;
			position:relative;
			margin:5px;
		    font-weight: bold;
		    padding:5px;
		    background: #f2f2f2;
		    border-radius: 4px;
		    text-indent:2px;
            border:1px solid #bbb;
		}
		
		.presetItem:hover
		{
		    box-shadow:0px 0px 5px rgba(0,0,0,.3);
		    background-color: #fff;
		    }
		
		.presetItem .deletePreset{
			display:none;
			padding:5px;
			position:absolute;
			top:0;
			left:-15px;
			background:#f77;
			color:#fff;
			text-decoration:none;
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px;
            }
		
		.presetItem .deletePreset:hover
		{
		    text-decoration:none;
		    background:#f00;
		    }
		
		.presetItem:hover .deletePreset{
			display:block;
		}
		
		.presetItem.dragging
		{
		    display:block;
		    width:73px !important;
		    background:#9f9;
		    border:1px solid #5f5;
		    box-shadow:0px 0px 5px #9f9;
		    border-radius:5px;
		    }
		    
		    .presetItem.dragging .deletePreset
		    {
		        display:none;
		        }
		    
	/* END Sidebar */

	/*		Calendar		*/
	#calendarBox{
	/*	position:relative;
		/*width:686px;*/
        width:auto;
		margin-bottom:20px;
      /*  z-index:2; */
	}
	
		/*		Table		*/
		#calendarBox table{
			border-collapse:separate;
			background-color:#d6d6d6;
			color:#4d4d4d;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:normal;
			font-size:14px;
		}
		
			/*		Table Cells		*/
			#calendarBox td, #calendarBox th{
				width:96px;
				/*border:1px solid #fff;*/
				background-color:#d6d6d6;
			}
			
			#calendarBox th  
			{
			    padding-bottom:7px;
			    }
			
			#calendarBox td{
				background:#fff;
				min-height:140px;
				border-radius:4px;
				vertical-align:top;
				position:relative;
			}
			
			
			#calendarBox .droppable
			{
				color:#4d4d4d;
				font-weight: bold;
			    }
			    
			    #calendarBox div.dayHeader span.date 
			    {
			        font-weight: bold;
			    }
			    
			#calendarBox .nonDroppable
			{
			    vertical-align:top;
				background:#bababa;
				color:#4d4d4d;
				position:relative;
				height:140px;
			    }

			#calendarBox .droppable.previous, #calendarBox .droppable.next{
				background:#bababa;
				color:#4d4d4d;
			}
			
			#calendarBox .nonDroppable.previous, #calendarBox .nonDroppable.next{
				background:#e6e6e6;
				color:#4d4d4d;
			}
			
			    
			    #calendarBox .nonDroppable div.dayHeader span.date 
			    {
			        font-size: 18px;
			        margin-top:2px;
			        margin-left:2px;
			        font-weight: normal;
			        color: #808080;
			    }
			    			
			/* Valid Drop */	
			/*	green	*/
			.validDrop{
				position:relative;
				box-shadow:
				0px 0px 1px rgba(0,200,0,.3),
				0px 0px 10px rgba(0,200,0,.3),
				0px 0px 10px rgba(0,200,0,.3) inset
				;
				border-color:#0f0;
				border-color:rgba(0,200,0,.3);
				color:#0d0;
				z-index:50;
			}
			
			/*	blue	
			#calendarBox .validDrop{
				position:relative;
				box-shadow:
				0px 0px 1px rgba(0,200,255,.3),
				0px 0px 10px rgba(0,200,255,.3),
				0px 0px 10px rgba(0,200,255,.3) inset
				;
				border-color:#0cf;
				border-color:rgba(0,200,255,.3);
				color:#0cf;
				z-index:48;
			}
			*/
			/* Warning */
			#calendarBox .validDrop.warningDrop{
				box-shadow:
				0px 0px 1px rgba(255,200,0,.5),
				0px 0px 10px rgba(255,200,0,.5),
				0px 0px 10px rgba(255,200,0,.5) inset
				;
				border-color:#fc0;
				border-color:rgba(255,200,0,.5);
				color:#ea0;
			}
			
				/*		Day Header		*/
				#calendarBox td .dayHeader{
					padding:0px;
					padding-top:3px;
				}
				
				#calendarBox .previous .dayHeader, #calendarBox .next .dayHeader{
					background:#e6e6e6;
				}
				
					/*		Date		*/
					#calendarBox td .date{
						display:block;
						float:left;
						min-width:32px;
						height:18px;
						padding:0px;
						margin:2px;
						margin-top:0;
						line-height:18px;
						font-size:18px;
					}
					
					/*		Day Actions		*/
					#calendarBox .dayAction{
						display:block;
						position:relative;
						width:18px;
						height:18px;
						margin:2px;
						float:right;
						background:url(/Images/CommuteTracker/DayIcons.png);
					}
					
					#calendarBox .dayAction:hover{
						cursor:pointer;
					}
					
					
					/*		Day Action Icon Positioning		*/	
					#calendarBox .inspectDay{ background-position:-1px -18px; } 
					#calendarBox td:hover .inspectDay{ background-position:-1px -1px; }
					#calendarBox .inspectDay .tooltip{
						background:#0CF;
					}
					#calendarBox .inspectDay .tooltip .pointer{
						border-top:5px solid #0CF;
					}
					
					#calendarBox .saveDay{ background-position:-17px -18px; } 
					#calendarBox td:hover .saveDay{ background-position:-17px -1px; }
					#calendarBox .saveDay  .tooltip{
						background:#0C3;
					}
					#calendarBox .saveDay .tooltip .pointer{
						border-top:5px solid #0C3;
					}
					
					#calendarBox .clearDay{ background-position:-35px -18px; } 
					#calendarBox td:hover .clearDay{ background-position:-35px -1px; }
					#calendarBox .clearDay  .tooltip{
						background:#C30;
					}
					#calendarBox .clearDay .tooltip .pointer{
						border-top:5px solid #C30;
					}
					
					#calendarBox .emptyDay .dayAction{
						display:none;
					}


						#calendarBox .dayAction .tooltip{
							position:absolute;
							display:none;
							top:-29px;
							left:0;
							font-size:12px;
							text-align:center;
							white-space:nowrap;
							padding:2px 5px;
							color:#fff;
							z-index:1;
							border-radius:5px;
						}
						
							/*		Tooltip Triangle		*/
							#calendarBox .tooltip .pointer{
								display:block;
								position:absolute;
								bottom:-5px;
								border-left:5px solid transparent;
								border-right:5px solid transparent;
							}
					
						/*END Day Action - Tooltip*/
						
					/*END Day Action*/
					
				/*END Day Header*/
				
					
				/*		calDay Wrapper		*/
				#calendarBox .calDayWrapper{
					position:relative;
					min-height:98px;
					margin-left:1px;
					margin-top:0px;
				}
				
				/*		Temp Drag Wrapper		*/
				#calendarBox .tempDragWrapper{
					width:100%;
					height:100%;
					/*overflow:Hidden;*/
				}
				
					/*		calDay		*/
					#calendarBox .calDay{
						position:absolute;
						/*overflow:Hidden;*/
						padding:0 0 1px 0;
					}
					
						/*		Sort Item		*/
						#calendarBox .sortItem{
							position:relative;
							margin:1px 0 1px 1px;
							float:left;
							z-index:49;
						}
						
						#calendarBox .sortItem.tempItem{
							opacity:0.3;
							cursor: pointer;
						}
						
						/*END sortItem*/
						
					/*END calDay*/
					
				/*END calDay Wrapper*/
			
			/*END Table Cell*/

		/*END table*/
	
	/*END Calendar*/
	
	
	
/*      customTooltip       */

.customTooltip
{
    display:none;
    cursor:default;
    }
    
    td.nonDroppable:hover .customTooltip
    {
        cursor:default;
        color: #EFEFEF;
        display: block;
        font-size: 11px;
        padding: 7px;
        }
        
    td.nonDroppable.notEditable:hover .customTooltip
    {
        display:none;
        }
    
 /*     radio groups    */
 
.radioLabel
{
    display: block;
    line-height: 26px;
    }

    .radioLabel .helpIcon
    {
        float:left;
        position:relative;
        margin:5px;
        }

    .yellowNotificationBox .helpIcon
    {
        float:right;
        position:relative;
        }

        .radioLabel .helpIcon .helpIconContent,
        .yellowNotificationBox .helpIcon .helpIconContent
        {
            bottom: 0;
            left: 18px;
            line-height: 16px;
            top: auto;
            width: 320px;
            }


        .yellowNotificationBox .helpIcon .helpIconContent
        {
            right: 18px;
            left:auto;
        }
    
.radioLabelTop
{
    display:block;
    clear:both;
    } 
 
.buttonGroupWrapper{ 
    display:inline-block;
    *display: inline;
    zoom: 1;
    border:1px solid #999;
    border-radius:3px;
    background:#e5e5e5;
    box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.6) inset, -1px -1px 0 rgba(0, 0, 0, 0.3) inset, 1px 1px 3px rgba(0, 0, 0, 0.3);

}

.replacedRadioButtonWrapper{
    background:url(/Images/NavTabs/nav-bar-shading.png) center -50px repeat-x;
    display:block;
    *display:inline;
    float:left;
    padding:0px 10px;
    cursor:pointer;
    height:26px;
    border-left:1px solid #fff;
    border-right:1px solid #aaa;
    position:relative;
}


.replacedRadioButtonWrapper:hover{
    background-position:center 1px;
    background-color:#ddd;    
    box-shadow: 0px -1px 0 rgba(0, 0, 0, 0.3) inset;
}


.replacedRadioButtonWrapper.checked{
    background: #F0713A;    
    border-left:1px solid transparent;
    border-right:1px solid transparent;
    box-shadow:none;
    color:#fff;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25) inset;
}

.replacedRadioButtonWrapper.first{
    border-left:none;
    border-top-left-radius:2px;
    border-bottom-left-radius:2px;
}

.replacedRadioButtonWrapper.last{
    border-right:none;
    border-top-right-radius:2px;
    border-bottom-right-radius:2px;
}

.replacedRadioButtonWrapper label{
    line-height:14px;
    cursor:pointer;
    margin:6px 2px 6px 15px;
    padding:0px;
} 


    .replacedRadioButtonWrapper input
    {
        position:absolute;
        top:3px;
        left:2px;
    }

/*		Check Boxes		*/

.replacedCheckBox
{
    display:block;
    margin:0;
	text-align:center;
    color:#fff;
	height:22px;
    background:url(/Images/CommuteTracker/checkboxReplacement.png) center bottom no-repeat;
    vertical-align:bottom;
}

.replacedCheckBox label{
	cursor:pointer;
}

.replacedCheckBox:hover{
    cursor:pointer;
}

.replacedCheckBox.isChecked, .replacedCheckBox.isChecked:active{
    background-position:center top;
}

.replacedCheckBox.isChecked:hover{
}


/****************		UI-Dialog		****************/
.ui-dialog{
	outline:none;
	border:2px solid #333;
	border-radius:10px;
	padding:0px;
}

.ui-dialog .ui-dialog-titlebar{
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	background-color:#333;
	border:none;
}

.ui-dialog .ui-dialog-titlebar-close.ui-state-hover{
	background:none;
	border:none;
}

.ui-dialog .ui-dialog-buttonpane{
	padding:3px 5px;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button{
	margin:2px;
	padding:0px;
}

.ui-widget-header .ui-dialog-titlebar-close .ui-state-hover .ui-icon{
	border:none;
	background-color:transparent;
}


/**************************************     KENDO OVERRIDE      ******************/

.k-inline-block, .k-picker-wrap .k-select, .k-numeric-wrap .k-select
{
    padding:4px 2px;
    }


.k-state-disabled
{
    opacity:0.4;
    filter: alpha(opacity=40);
    }
    
.tripItemNumPassengers .k-select .k-icon
{
    position:relative;
    top: 2px;
    right:-3px;
    }

/**********************************************************************************/

/*  EditWindow SPECIFIC */

    
 .popUpContent .sectionFull, 
 .popUpContent .sectionHalf, 
 .popUpContent .sectionOneThird, 
 .popUpContent .sectionTwoThird
 {
    /* padding-top:0px; */
    min-height:50px;
     }
.popUpContent .distanceSection
{
    min-height:0px
    }


#calendarBox .dayHeader .inspectDay{ display:none; }

.tripPurposeWrapper
{
    
    }

.popUpContent .sectionTwoThird.presetName input[type=text]
{
    margin:3px 0;
    }
    
    
    .editWindowInvalidItem
    {
        background: none repeat scroll 0 0 #FDBCBC;
        border-radius: 4px 4px 4px 4px;
        box-shadow: 0 0 10px #FFBEBE;
        }
   
   
   .presetSection, .presetName
   {
       display:none;
       }     
 
 
 .editWindow .predictiveTravelSaveboxWrp{ display:none; }
 
 
.editWindow .returnTripSection{ width:130px;  }

.editWindow .departTimeSection{ width:90px; }

.editWindow .returnTimeSection{ width:90px; }

.editWindow .roleSection{ }

.editWindow .passengersSection{  }

.editWindow .vehicleSection{  }


/* TIMEPICKER FLY OUT FIX -- god damn this was annoying to do */
.k-list-container .k-list .k-item {
    white-space: nowrap;
}


#commuteModeTooltip
{
    position:relative;
    min-height:16px;
    line-height:16px;
    font-size:11px;
    width:111%;
    margin-left:-15px;
    text-align:center;
    z-index:50;
    clear:both;
    border-radius:4px;
    color:#fff;
    }



/***********************************************************************************/
/*********      Styling for top of page --> instructions and emission info      *********/

div.commuteTracker div.infoTopWrapper 
{
    width: 900px;
    margin: 0 auto;
    margin-bottom: 0;
}

div.commuteTracker div.instructionToggleHeader 
{
    width: 445px;
    height: 60px;
    background: #c6c6c6;
    float:left;
    border-radius: 10px;
    border: 1px solid #4d4d4d;
    cursor: pointer;
}

div.commuteTracker div.instructionToggleHeader h1, div.commuteTracker div.emissionTopToggleHeader h1
{
    font-size: 20px;
    color: #4d4d4d;
    margin-left: 30px;
    margin-top: 15px;
    width:225px;
    float:left;
}

div.commuteTracker div.instructionToggleHeader:hover h1, div.commuteTracker div.emissionTopToggleHeader:hover h1 
{
    color: #e6e6e6;
}

div.commuteTracker div.instructionToggleHeader p, div.commuteTracker div.emissionTopToggleHeader p 
{
    display:none;
}

div.commuteTracker div.emissionTopToggleHeader 
{
   width: 400px;
   height: 60px;
   background: #c6c6c6;
   float: left;
   margin-left:50px;
   border-radius: 10px;
   border: 1px solid #4d4d4d;
   cursor: pointer;
}


div.commuteTracker span.expandCircle 
{
    display: block;
    width: 50px;
    height: 50px;
    /*background: #e6e6e6;*/
    float:right;
    margin-top: 10px;
    margin-right:30px;
    text-align: center;
    color: #4d4d4d;
    font-size:30px;
    font-weight: bold;
    /*background-image: url('/Images/CommuteTracker/expandCircleUp.png');
    background-repeat: no-repeat;
    background-position: center center;*/
    
}

div.commuteTracker div.instructionToggleHeader:hover span.expandCircle, div.commuteTracker div.emissionTopToggleHeader:hover span.expandCircle
{
    color: #e6e6e6;
    
}


/*     tooltips on trip items     */

#calendarBox .sortItem:hover
{
    z-index:100;
    }

    .calDay div:hover .customTooltip
    {
        position:absolute;
        display:block;
        padding:3px;
        background:#333;
        top:-25px;
        left:-160%;
        opacity: 1;
        color:#fff;
        z-index:100;
        font-size:12px;
        white-space:nowrap;
        font-weight:normal;
        border-radius:5px;
        }
 
 /*     Tooltips on calendar days       */
 
 td .calDay .instruction{ display:none; }
 
 td.emptyDay:hover .instruction
 {
     cursor:default;
    display: block;
    font-size: 11px;
    padding:0px 5px;
    font-weight:normal;
    }


/*******************************************/

.helpIcon
{
    width:16px;
    height:16px;
    background-image:url("/Images/ProfileImages/ProfileHelpButton.png");
    background-repeat:no-repeat;
    }

.helpIcon .helpIconContent
{
    display:none;
    background: none repeat scroll 0 0 #EEEEEE;
    border: 2px solid #333333;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 0 15px #555555;
    color: #333333;
    right: 5px;
    min-width: 100px;
    padding: 5px;
    position: absolute;
    bottom: 5px;
    z-index: 98;    
    }

    .helpIcon .helpIconContent strong
    {
        display: inline-block;
        margin-top: 5px;
        }


.helpIcon:hover .helpIconContent
{
    display: block;
    }




.saveDayEx
{
    background: url("/Images/CommuteTracker/DayIcons.png") repeat scroll -17px -1px transparent;
    display: inline-block;
    height: 18px;
    position: relative;
    width: 18px;
    margin:-6px 0px;
    }

/**************************************/

#calendarBox .calDay
{ 
    position:relative;
}

.droppableDayOverlay
{
    display:none;
}

 /*     CALDAY DURING DRAG EVENTS     */

.userIsDragging
{
   /* background: none repeat scroll 0 0 #333333; */
    position:relative;
    /*top:-1px;*/
    width:100%;
    }
    
    #calendarBox .userIsDragging .calDayWrapper
    {
        position:absolute;
        top:0;
        left:0;
        height:100%;
        width:100%;
        margin:0px;
        }
        
    #calendarBox .validDrop .calDayWrapper
    {
        background:rgba(200,255,200,.5);
        }
        
    #calendarBox .userIsDragging .calDay
    {
        position:absolute;
        top:0;
        left:0;
        height:100%;
        width:100%;
        padding-right:0px;
        padding-left:1px;
        }
        
        #calendarBox .userIsDragging .calDay .droppableDayOverlay
        {
            display:block;
            position:relative;
            top:0px;
            left:0px;
            width:100%;
            height:25px;
            }


/*******************************************/
td.validDrop:hover .instruction
{
    display:none;
    }

/*     RETURN TIME COVER ELEMENT     */

.editWindow .editReturnTimeContainer
{
    position:relative;
    }

.editWindow .editReturnTimeContainer .returnTimeCover
{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgb(255,255,255);
    /*z-index:100;*/
    }

/*****************      JQUERY UI TABS      **********************/


#tabs.ui-tabs 
{
    width:747px;
    float:right;
    margin-right:25px;
}


/****************		clearfix		****************/

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}



/*********************** added by kyle ************************/

/*      Calendar Navigation     */

div.calendarNavigation 
{
    float:right;
    width:716px;
    height:40px;
  /*  margin-top:40px; */
    text-align: center;
     margin-bottom:20px;
  
}

div.calendarNavigation table 
{
    margin: 0 auto;
    width: 500px;
}

div.calendarNavigation table tbody tr td 
{
    vertical-align: middle;
}


h2.monthTitle span 
{
    font-size: 21px;   
}

table.titleTable 
{
    width:450px;
    margin: 0 auto;
    padding-top:10px;
}
    
/* back & next buttons */
div.calendarNavigation div.previousBtn, div.calendarNavigation div.nextBtn 
{
    width:30px;
    height:22px;
    padding: 2px 10px 2px 10px;
	display: block;
	background-image: url(/Images/CommuteTracker/btngradient.png);
	background-repeat:repeat-x;
	background-position: center center;
	border-radius: 5px;
	border: 1px solid #4d4d4d;

}

div.calendarNavigation div.skipBackBtn, div.calendarNavigation div.skipAheadBtn 
{
    width: 60px;
    height: 22px;
    padding: 2px 10px 2px 10px;
	display: block;
	background-image: url(/Images/CommuteTracker/btngradient.png);
	background-repeat:repeat-x;
	background-position: center center;
	border-radius: 5px;
	border: 1px solid #4d4d4d;
}


div.commuteTracker div.calendarNavigation div.skipBackBtn a, 
div.commuteTracker div.calendarNavigation div.previousBtn a, 
div.commuteTracker div.calendarNavigation div.nextBtn a, 
div.commuteTracker div.calendarNavigation div.skipAheadBtn a
{
    font-size:18px;
    font-weight: bold;
    color: #e6e6e6;
    text-align:center;
    display: block;
    }


/* button hover states */

div.calendarNavigation div.skipBackBtn:hover, 
div.calendarNavigation div.previousBtn:hover, 
div.calendarNavigation div.nextBtn:hover, 
div.calendarNavigation div.skipAheadBtn:hover 
{
    cursor: pointer;
    background-image: url(/Images/CommuteTracker/btngradientHover.png);
	background-repeat:repeat-x;
}

div.commuteTracker div.calendarNavigation div.skipBackBtn a:hover, 
div.commuteTracker div.calendarNavigation div.previousBtn a:hover, 
div.commuteTracker div.calendarNavigation div.nextBtn a:hover, 
div.commuteTracker div.calendarNavigation div.skipAheadBtn a:hover 
{
   
    text-decoration: none;
} 



#commuteTrackerMonthYear
{
    white-space:nowrap;
    }

.pointReedemActionSection
{
    width:190px;
    margin:20px 0 0 10px;
}
.pointRedeemButton a,
.pointRedeemButton a:active,
.pointRedeemButton a:visited
{
    background-color: #E26A00;
    background-image: url("/Images/ProfileImages/ItemBlockButtonBkg.png");
    background-repeat: repeat-x;
    border: 1px solid #E26A00;
    border-radius: 7px 7px 7px 7px;
    color: #FFFFFF;
    display: block;
    font-family: Arial,Sans-Serif;
    font-size: 13px;
    font-weight: bold;
    /*height: 32px;*/
    line-height: 15px;
    padding: 7px 15px;
    width: 140px;
    margin-bottom:5px;
    text-align:center;
}

.pointRedeemButton a:hover
{
    background-color: #e98503; /*PULL FROM DATABASE*/
    color: #fff; /*PULL FROM DATABSE - SAME AS COLOR FOR NON HOVER*/
    text-decoration:none;
}





.ui-draggable-dragging
{
    z-index:999;
}





/* Feature Help Pop Up */
.featureHelpPopUp{ 
    background:#fff; 
    color:#666; 
    padding:5px;
    border:2px solid #558eff;
    border-radius:5px;
    box-shadow:0px 0px 5px;
    display:inline-block;
    max-width:300px; 
    position:absolute;
    z-index:999;
}

.featureHelpPopUp .popUpPointer{
    border-bottom: 10px solid #558eff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    display: block;
    height: 0;
    left: 10px;
    position: absolute;
    top: -12px;
    width: 0;
}
.featureHelpPopUp .closePopUp{
    position:absolute;
    display:block;
    top:1px;
    right:2px;
}









/*   Ridetrack additions   */
/* .hideRideTrak .ridetrakEntry .ridetrakIcon{
	display:none;
}
 */

.hideRideTrak .ridetrakEntry .ridetrakIconDisabled{
    position: absolute;
    top: 0PX;
    left: 0PX;
    font-size: 12px;
    background: #fff;
    color: #666;
	
    color: rgba(0,0,0,0.3);
    border-radius: 0px;
    line-height: 85%;
    padding: 0px 0px 0px 3px;
    margin: 0;

    background: rgba(255,255,255,0.5);
    width: 100%;
    height: 100%;
	
    font-size: 39px;
    font-weight: normal;
}


.hideExternal .externalEntry .externalIconDisabled {
    position: absolute;
    top: 0PX;
    left: 0PX;
    font-size: 12px;
    background: #fff;
    color: #666;
    color: rgba(0,0,0,0.3);
    border-radius: 0px;
    line-height: 85%;
    padding: 0px 0px 0px 3px;
    margin: 0;
    background: rgba(255,255,255,0.5);
    width: 100%;
    height: 100%;
    font-size: 39px;
    font-weight: normal;
}

#calendarBox .ridetrakEntry {
}

.ridetrakIcon {
    position: absolute;
    top: 0PX;
    left: 0PX;
    font-size: 12px;
    background: #fff;
    /*border-radius: 0px;*/
    line-height: 85%;
    padding: 1px;
    margin: 0;
}

#calendarBox .externalEntry {
}

.externalIcon {
    position: absolute;
    top: 0PX;
    left: 0PX;
    font-size: 12px;
    /*background: #fff;*/
    /*border-radius: 0px;*/
    line-height: 85%;
    /*padding: 1px;*/
    margin: 0;
    border:1px solid #f5f5f5;
}
#commuteTrackerSidebar .sidebarVehicleSection {
    margin-top:20px;
}

#commuteTrackerSidebar .fullDetails {
    font-size:12px;
}

#commuteTrackerSidebar .bootstrap {
    background:none;
}


#commuteTrackerSidebar .panel.panel-default {
    margin: 5px;
}

.glyphicon.glyphicon-plus.pull-right.createVehicle {
    margin-top: 7px;
    margin-right: 15px;
}


#commuteTrackerSidebar .list-group-item.vehicleItem {
    padding: 10px;
}



#commuteTrackerSidebar .bootstrap h4 {
    margin: 0;
    font-size: 14px;
    font-weight: bold;
}

.vehicleItem .ZEVConfirmedIcon{
    color:#e0ce0d;
	float:left;
	display:block;
	
    height: 17px;
    margin-left: -10px;
}


#commuteTrackerSidebar .bootstrap .vehicleItem.active h4 {
    /*white-space:nowrap;
    float: left;
    padding: 5px 0;*/
}

td.nonDroppable.notEditable.maxEntriesReached .maxEntriesToolTip {
    display:none;
}

td.nonDroppable.notEditable.maxEntriesReached:hover .maxEntriesToolTip{
    display:block;
    float:left;
    clear:left;
}


 
/*   td.nonDroppable.notEditable.maxEntriesReached .maxEntriesToolTip {
    display:block;
    float:left;
    clear:left;
}
 */












.noZEVsErrorMessage {
    display: block;
    position: absolute;
    background: rgb(255,255,255);
    background: rgba(255,255,255,0.9);
    top: 1px;
    width: 100%;
    left: 0px;
    height: 100%;
    z-index: 999;
    padding: 20px;
    box-sizing: border-box;
    padding-top: 30px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.6;
}





.calendar-route-options {
    margin:8px 0;
}

.calendar-route-options--option-row {
    display: flex;
    padding: 4px;
}

.calendar-route-options--checkbox img {
    max-height: 40px;
}

.calendar-route-options--label {
    margin-left:8px;
}




#CalendarVehicleOwnershipVerification .message {
    padding:16px;
}



.userIsDragging .routeOptionsContainer {
    position: absolute;
    bottom: 0;
}