html, body {
	background-color: #555555;
	font-size: 12px;
	font-family: Helvetica Neue,Arial,Helvetica,'Liberation Sans',FreeSans,sans-serif;
	color: #000;
	margin: 0;
	padding: 0;
	text-align: center;
	direction: ltr;
	unicode-bidi: embed;
}

h1{
	/*color: green;
	text-align: center;
	font-weight: bold;
	background-color: #DDDDDD;
	padding: .2em .5em;
	margin-top: 1.0em;
	border-top: 3px solid #666666;
	border-bottom: 2px solid #999999;
	width:auto;*/
}

h2 {
	color: #f98f02;
	text-align: center;
/*	text-shadow: 0 1px 1px #777;*/
/*	font-size: 14px;*/
	/*font-weight: bolder;*/
/*	margin-top: 5px;*/
/*	margin-bottom: 5px;*/
	margin: 0px;
	padding: 5px;
}

h3{
	text-align: center;
/*	font-size: 30px;*/
	font-family: 'Calibri';
    color: #f98f02;
/*	margin-top: 5px;*/
/*	margin-bottom: 5px;*/
	margin: 0px;
	padding: 5px;
}

h4{
	color: #EEE;
	text-align: center;
/*	text-shadow: 0 1px 1px #333;*/
/*	font-size: 16px;*/
	/*font-weight: bolder;*/
	margin-top: 5px;
	margin-bottom: 5px;
}

img{ 
	border-style: none;
	border: 0px;
}

textarea{
	font-family: Helvetica Neue,Arial,Helvetica,'Liberation Sans',FreeSans,sans-serif;
}



/* divs */
#popout-outer{
	height: 100%;
	width: 100%;
	background: #888;	
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 1002;
	opacity:0.80;	 		  
	filter:alpha(opacity=80);  /*IE solution*/
	text-align: center;
}

#popout-outer2{
	height: 100%;
	width: 100%;
	background: black;	
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1001;
	text-align: center;
}

#popout-content{
	background: white;
	padding: 20px;
	overflow-y: auto;
}

#header-div{
	background-color: #0769AD;
	height:50px;
	width: 100%;
	position: relative;
	z-index: 1000;
}

#header-left{
	position: absolute;
	left: 0px;
	background-color: #0769AD;
	z-index: 1;
}

#header-right{
	height: 100%;
	position: absolute;
	right: 0px;
	display: table;
}

#logo{
	background:url(../img/es/ecoach-logo-simple.png) no-repeat;
	width: 70px;
	color: #f98f02;
	font-weight: bolder;
}
#logo:hover{
	background-color: #FFF;
	color: #000;
}

#ecoach-menu{
	
}

#account-menu{
	display: table-cell;
	vertical-align: middle;
}

#profileIMG{
	height: 150px;
}

#content{
	width: inherit;
	/*height:555px;*/
	background-color: transparent;
}
#content2{
	height:100%;
	background-color: whitesmoke;
}
#content3{
	width: 100%;
	height:100%;
	background-color: #AAA;
}

.break{
	page-break-before: always;
/*	page-break-after: always;*/
}


/* element-wise */


/* shortcuts */
.ctr{
	text-align: center;
}

.lft{
	text-align: left;
}
.rgt{
	text-align: right;
}

.flr{
	float: right;
}

.fll{
	float: left;
}

.over-y{
	overflow-y: scroll;
}

/* custom */
.topleft{
	position: absolute;
	top: 0px;
	left: 0px;
	text-align: left;
}


.valign{
	/*height: 150px;
	width:200px;*/
	display: table;
	/*padding:10px;
	background:red;*/
}

.valign p {
  display: table-cell;
  vertical-align: middle;
}


/*.pointer{
	cursor: pointer;	
}*/

.exit{
	font-size: 15px;
	font-style: bolder;
	color: cyan;
}

.click:hover{
	cursor: pointer;
}

/* menus */
.menu {
    width: 100%;
    background-color: transparent;
	font-weight: bold;
	font-size: 0.9vmax;
/*	height: 30px;*/
}

.menu ul{
    margin: 0; padding: 0;
    float: left;
}
 
.menu ul li{
    display: inline;
}
 
.menu ul li a{
    float: left; text-decoration: none;
    color: white;
    padding: 5px 0px;
    background-color: transparent; 
    height: 50px;
/*    border-width: 1px;
    border-bottom: 1px solid transparent;
    border-right: 1px solid transparent;
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;*/
}
 
 
.menu ul li a.loginBTN{
	color: white;
	background: #1BE070;
}
.menu ul li a.current{
	color: white;
/*	background: #f98f02;*/
}
.menu ul li a.current2{
	color: #f98f02;
	background: #FFF;
}

.current2 .y{
	color: #000;
}

.menu ul li a:hover, .menu ul li .current:hover{
/*	color: #f98f02;*/
	color: #555;
	background: #EEE;
}

.menu2 {
    width: 100%;
    background-color: transparent;
	font-weight: bold;
	font-size: 12px;
	height: 30px;
}

.menu2 ul{
    margin: 0; padding: 0;
    /*float: left;*/
}
 
.menu2 ul li{
    display: inline;
}
 
.menu2 ul li a{
    float: left; text-decoration: none;
    color: white;
    padding: 5px 5px;
    background-color: transparent; 
	border-bottom: 2px solid transparent;
}
 
.menu2 ul li a:visited{
    color: white;
}
 
.menu2 ul li a:hover, .menu2 ul li .current{
/*    color: #f98f02;*/
/*	background-color:#CCC;*/
	border-bottom: 2px solid white;
}

/* colors */
.ec0{
	color: white;
}
.ec1{
	color: #f98f02;
}

.noshadow{
	text-shadow: none;
}

.ec1b{
	color: #f98f02;
	border-bottom: 2px solid #f98f02;
}

.ecbckgnd{
	background: black;
}

.i{
	font-style: italic;
}

.p15{
	font-size: 15px;
}

.navy{
	color: navy;
}

.b{
	color: black;
}
.bl{
	color: #2B95FF;
}

.cy{
	color: cyan;
}

.gy0{
	color: #777;	
}

.gy1{
	color: #555;	
}

.gy2{
	color: #333;	
}

.gy{
	background: #EEE;
}

.o{
	color: #f98f02;
}

.r{
	color: red;
}

.tq{
	color: #00ffff;
}

.w{
	color: white;
	font-weight: bolder;
}

.bolder{
	font-weight: bolder;
}

.y{
	color: yellow;
}

.gr{
	color: #15bd5c;
}

.p{
	color: #FF0084;
}

.currentAPP{
	color: #EEE;
	font-weight: bolder;
	border-bottom: 2px solid #FFF;
}
.ecoachAPP{
	color: white;
}

/* custom */
.ecoach-drop{
	position: relative;
	top: -1px;
	border-style: solid dashed dashed;
	border-color: transparent;
	border-top-color: #CCC;
	display: -moz-inline-box;
	display: inline-block;
	font-size: 0;
	height: 0;
	line-height: 0;
	width: 0;
	border-width: 3px 3px 0;
	padding-top: 1px;
	left: 4px;
}

.ecoach-table img{
	opacity:0.40;	 		  
	filter:alpha(opacity=40);  /*IE solution*/
}

.ecoach-table img:hover{
	opacity:1;	 		  
	filter:alpha(opacity=100);  /*IE solution*/
}

.ecoach-table tr:hover{
	color: white;
}

.vl {
	height: 100%;
	border-right: 1px solid #FFF;
}

.hl-0{
	border-bottom: 0px solid #FFF;
	clear: both;
}
.hl{
	border-bottom: 1px solid #FFF;
	clear: both;
}
.hlg{
	border-bottom: 1px solid #999;
	clear: both;
}
.hlo{
	border-bottom: 1px solid #f98f02;
	clear: both;
}
.hlodot{
	border-bottom: 1px dotted #f98f02;
	clear: both;
}
.hln{
	border-bottom: 1px solid transparent;
	clear: both;
}
.hln2{
	border-bottom: 2px solid transparent;
	clear: both;
}
.hln3{
	border-bottom: 3px solid transparent;
	clear: both;
}
.hldot{
	border-bottom: 1px dotted #FFF;
	clear: both;
}
.hlgdot{
	border-bottom: 1px dotted #999;
	clear: both;
}
.pad10{
	padding: 10px;
}
.pad20{
	padding: 20px;
}
.margin10{
	margin: 10px;
}
.margin20{
	margin: 20px;
}

.only-landscape{
	
}
.only-portrait{
	
}
.only-mobile{
	
}
.only-non-mobile{
	
}

/* ----  Menu -----*/
.ec-menu-div{
	width: 16%;
}

/* ----  Menu -----*/

.ec-BTN-half{
	width: 48%;
}

.ec-BTN-full{
	width: 98%;
}

/* overrides jquery-ui (if present) */
.ec-button{
	border-radius: 2px;
	border: 1px solid #dddddd;
	min-height: 26px;
	margin: 5px 5px;
	font-weight: bolder;
	
	/* Jquery-UI button defaults */
	display: inline-block;
	position: relative;
	padding: 0;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	overflow: visible; /* removes extra width in IE */
}


.ec-button > span:not(.ui-button-text){
	padding: .4em 1em;
}
.ec-button span span{
/*	padding: 0px;*/
}

.ec-button:hover{
	cursor: pointer;
}

.ec-blankBTN{
	color: #555;
	border: 1px solid #DDD;
	background: #FDFDFD;
}
.ec-activeBTN{
	color: #FFF;
	border: 1px solid #f98f02;
	background: #f98f02;
}
.ec-greenBTN{
	color: #FFF;
	border: 1px solid #1BE070;
	background: #1BE070;
}
.ec-redBTN{
	color: #FFF;
	border: 1px solid #FB5A3E;
	background: #FB5A3E;
}
.ec-blueBTN{
	color: #FFF;
	border: 1px solid #0073EA;
	background: #0073EA;
}

.ec-blankBTN:hover{
	color: #000;
	border: 1px solid #AAA;
	background: #FAFAFA;
}
.ec-activeBTN:hover{
/*	color: #f98f02;*/
	background: #fd9f22;
}
.ec-greenBTN:hover{
/*	color: #1BE070;*/
	background: #38e783;
}
.ec-redBTN:hover{
/*	color: #FB5A3E;*/
	background: #fc7b65;
}
.ec-blueBTN:hover{
/*	color: #0073EA;*/
	background: #1188ff;
}
/* ----COMMON------- */
	
/* CSS FORMS: */
.highlight{
	background-color: white; /*#9DCEEA;*/
}
.file{
	height: 25px;
	width: 250px;
}
.field{
	margin: 5px;
	width: auto;
}
.field img:hover{
	cursor: pointer;
}
.field .label{
	font-weight: bold;
	width: 250px;
	color: black;
}
.field input:not(.ec-button){
	width: 90%;
	padding: 15px 5%;
	border: thin solid #AAA;
	background-color: white;
	font-size: 1.2em;
}
.field select{
	width: 100%;
	padding: 15px 5%;
	border: thin solid #AAA;
	background-color: white;
	font-size: 1.2em;
}

.field .dob{
	width: 32%;
}
.field .location{
	width: 105px;
}
.field .country{
	width: 105px;
}
.field h3{
	color: #333;
	font-size: 14px;
}
.field table{
	width: 100%;
}
.field table td{
	padding: 0px;
}
.field table button, .field .ec-button{
	width: 100%;
	padding: 10px;
	margin: 0px;
	font-size: 1.2em;	
}

/*        */
.left{
	/*background: red;*/
	width: 50%;
	float: left;
}
.right{
	/*background: green;*/
	width: 50%;
	float: right;
}
.left-inner{
	background: #EEE;
	text-align: left;
	
	border: 15px solid whiteSmoke;
	padding: 20px;
}
.right-inner{
	background: #EEE;
	text-align: left;
	
	border: 15px solid whiteSmoke;
	padding: 20px;
}

.picture{
	text-align: right;
	padding: 20px;
}
.picture img{
	border: 1px dotted #333;;
	width: 160px;
	height: 180px;
	top: -170px;
	position: relative;
	padding: 10px;
}
.picture .details{
	width: 350px;
	text-align: left;
	height: 180px;
	position: relative;
	top: 15px;
}
.picture .details2{
	text-align: right;
}

.details2 td{
	border-bottom: 1px dotted #999;
}
.info{
	text-align: right;
	font-weight: bold;
	font-size: 13px;
	font-style: italic;
}

.ecoach-info{
	text-align: left; 
	font-size: 12px;
	padding: 20px;
}


/* CSS FORMS: TODO: clean file */

.testname{
	color: #333;
	font-size: 15px;
/*	text-shadow: 0 1px 1px #888;*/
	font-style: italic;
	font-weight: bold;
}

.coursename{
	
}

/*  FLOT CHARTS */

/*body { font-family: Verdana, Arial, sans-serif; font-size: 12px; }
h1 { width: 450px; margin: 0 auto; font-size: 12px; text-align: center; }*/
/*#placeholder { 
	width: 450px; height: 200px; position: relative; margin: 0 auto; 
}*/

/*
.legend table, .legend > div { 
	height: 82px !important; 
	opacity: 1 !important; 
	filter:alpha(opacity=100);  
	right: -55px; 
	top: 10px; 
	width: 116px !important; 
}
.legend table { 
	border: 1px solid #555; 
	padding: 5px; 
}

*/

#flot-tooltip { 
	font-size: 12px; 
	font-family: Verdana, Arial, sans-serif; 
	position: absolute; 
	display: none; 
	border: 2px solid; 
	padding: 5px; 
	background-color: #FFF; 
	opacity: 0.8;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	-khtml-border-radius: 5px; 
	border-radius: 5px; 
}

.legend table {
	border-spacing: 5px;
}

/*  CSS MENU */
.cssmenu1{
	border:none;
	border:0px;
	margin:0px;
	padding:0px;
	font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
	font-size:13px;
	font-weight:bold;
	}
.cssmenu1 ul{
	background:#0769AD;
	height:30px;
	list-style:none;
	margin:0;
	padding:0;
	}
	.cssmenu1 li{
		float:left;
		padding:0px;
		margin:0px;
		}
	.cssmenu1 li a{
		background:#0769AD;
		/*background:#111111 url("cssmenu1_imgs/seperator.gif") bottom right no-repeat;*/
		color:#eee;
		display:block;
		font-weight:normal;
		line-height:50px;
		margin:0px;
		padding:0px 5px;
		text-align:center;
		text-decoration:none;
		}
	.cssmenu1 li a:hover, .cssmenu1 ul li:hover a{
/*			background: #f98f02 url("cssmenu1_imgs/hover.gif") bottom center no-repeat;*/
/*			background: #f98f02 url("cssmenu1_imgs/hover.png") bottom center no-repeat;*/
/*			background: #0a94ef url("cssmenu1_imgs/hover.png") bottom center no-repeat;*/
			background: #097bc8;
			color:#FFFFFF;
			text-decoration:none;
			}
	.cssmenu1 li ul{
		background:#097bc8;
		display:none;
		height:auto;
		padding:0px;
		margin:0px;
		border:0px;
		position:absolute;
		width:150px;
		z-index:1000;
		}
	.cssmenu1 li:hover ul{
		display:block;
		
		}
	.cssmenu1 li li {
/*		background:url('cssmenu1_imgs/sub_sep.gif') bottom left no-repeat;*/
		display:block;
		float:none;
		margin:0px;
		padding:0px;
		width:150px;
/*		border-bottom: 1px solid #0769AD;*/
		}
	.cssmenu1 li:hover li a{
		background:none;
		
		}
	.cssmenu1 li ul a{
		display:block;
		height:30px;
		line-height: 30px;
		font-size:12px;
		font-style:normal;
		margin:0px;
		padding:0px 10px 0px 10px;
		text-align:left;
		}
		.cssmenu1 li ul a:hover, .cssmenu1 li ul li:hover a{
/*			background:#777 url('cssmenu1_imgs/hover_sub.gif') center left no-repeat;*/
/*			background:#0769AD url('cssmenu1_imgs/hover_sub.png') center left no-repeat;*/
			background:#0769AD;
			border:0px;
			color:#ffffff;
			text-decoration:none;
			}
	.cssmenu1 p{
		clear:left;
		}