@import url(//fonts.googleapis.com/css?family=Roboto:100,300,400,500);

/* Practisis Index */
html,body{
	/*background: #fbfbfb; 
	background: -moz-radial-gradient(center, ellipse cover,  #fbfbfb 0%, #fbfbfb 37%, #a5a7aa 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fbfbfb), color-stop(37%,#fbfbfb), color-stop(100%,#a5a7aa));
	background: -webkit-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%);
	background: -o-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%);
	background: -ms-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%);
	background: radial-gradient(ellipse at center,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#a5a7aa',GradientType=1 ); */
	font-family: Roboto, Arial, Helvetica, sans-serif;
	font-size:12px;
	padding: 0; 
	margin: 0;
	height: 100%;
	min-height: 100%;
	color: #087877;
	overflow-y:auto;
	overflow-x:hidden;
	}
	
#header{
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #d3d4d5 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#d3d4d5)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#d3d4d5 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#d3d4d5 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#d3d4d5 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#d3d4d5 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d3d4d5',GradientType=0 ); /* IE6-9 */
	height: 60px;
	border-bottom: 1px solid #a2a5a7;
	}
	
#headerTable{
	width: 100%;
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	}
	
#headerTable th,td{
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	}

#headerTable td:first-child{
	width: 60px;
	}
	
#headerTable td:nth-child(2){
	width: 100px;
	}
	
#headerTable td:nth-child(3){
	width: 200px;
	}
	
#headerTable td:nth-child(4){
	width: 600px;
	}
	
.userContainer{
	width: 100px;
	height: 15px;
	overflow: hidden;
	padding: 0px;
	margin: 0px;
	}
		
#userTable{
	color: #B1B3B6;
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	font-size: 8px;
	}
	
#userTable th,td{
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	}
	
#userTable td:first-child{
	width: 100px;
	}
	
#headerTableOptions{
	margin-left: auto;
	margin-right: 10px;
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	width: 200px;
	}
	
#headerTableOptions th,td{
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 0px;
	}
	
.userInformation{
	color: #0F7D92;
	font-size: 12px;
	font-weight: 500;
	padding: 0px;
	margin: 0px;
	}
	
#moduleText{
	text-align: left;
	color: #0F7D92;
	font-size: 30px;
	font-weight: 300;
	padding: 0px;
	padding-left: 10px;
	margin: 0px;
	border-left: 1px solid #CDCDCD;
	}
	
#mainDiv{
	text-align: center;
	max-width:100%;
	width:100%;
	}
	
#footer{
	background: rgb(0,158,220); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,158,220,1) 0%, rgba(0,186,239,1) 72%, rgba(0,143,213,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,158,220,1)), color-stop(72%,rgba(0,186,239,1)), color-stop(100%,rgba(0,143,213,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 72%,rgba(0,143,213,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 72%,rgba(0,143,213,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 72%,rgba(0,143,213,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 72%,rgba(0,143,213,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009edc', endColorstr='#008fd5',GradientType=0 ); /* IE6-9 */
	font-weight: 300; 
	display: none;
	position: fixed;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: 60px;
	color: #ffffff;
	z-index: 99999;
	}
	
#innerFoot{
	background-image: url('../images/footerShade.png');
	background-repeat: no-repeat;
	background-position: center top;
	height: 60px;
	margin-top: 0px;
	}
	
#footContent{
	background-image: url('../images/tutbg.png');
	background-repeat: no-repeat;
	background-position: center center;
	height: 60px;
	margin-top: 0px;
	width: 500px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	line-height: 5;
	}
	

	
/* Practisis Botones y menus*/
.generalButton{
	cursor: pointer;
	margin-top: 11.5px;
	margin-left: 10px;
	}
	
.moduleOpen{
	display: none;
	}
	
.submenu{
	z-index: 9999;
	position: absolute;
	top: 60px;
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(226,227,228,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(226,227,228,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(226,227,228,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(226,227,228,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(226,227,228,1) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(226,227,228,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2e3e4',GradientType=1 ); /* IE6-9 */
	display: none;
	border-radius: 5px;
	border: 2px solid #878588;
	color: #878588;
	font-size: 16px;
	cursor: pointer;
	box-shadow:  1px 2px 5px 0px rgba(50, 50, 50, 0.59);
	}
	
.submenuHover{
	background: rgb(0,158,220); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,158,220,1) 0%, rgba(0,186,239,1) 63%, rgba(0,143,213,0.7) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,158,220,0.7)), color-stop(63%,rgba(0,186,239,1)), color-stop(100%,rgba(0,143,213,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009edc', endColorstr='#008fd5',GradientType=0 ); /* IE6-9 */
	color: #ffffff;
	}
	
.submenuOptions{
	padding: 5px;
	}
	
.submenuOptionsInactive{
	background: -moz-linear-gradient(top,  rgba(219,219,219,1) 0%, rgba(237,237,237,1) 63%, rgba(211,211,211,0.7) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(219,219,219,1)), color-stop(63%,rgba(237,237,237,1)), color-stop(100%,rgba(211,211,211,0.7))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(219,219,219,1) 0%,rgba(237,237,237,1) 63%,rgba(211,211,211,0.7) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(219,219,219,1) 0%,rgba(237,237,237,1) 63%,rgba(211,211,211,0.7) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(219,219,219,1) 0%,rgba(237,237,237,1) 63%,rgba(211,211,211,0.7) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(219,219,219,1) 0%,rgba(237,237,237,1) 63%,rgba(211,211,211,0.7) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdbdb', endColorstr='#b3d3d3d3',GradientType=0 ); /* IE6-9 */
	padding: 5px;
	}
	
.headerButtons{
	background: rgb(0,165,171); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,165,171,1) 0%, rgba(8,120,119,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,165,171,1)), color-stop(100%,rgba(8,120,119,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,165,171,1) 0%,rgba(8,120,119,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,165,171,1) 0%,rgba(8,120,119,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,165,171,1) 0%,rgba(8,120,119,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,165,171,1) 0%,rgba(8,120,119,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00a5ab', endColorstr='#087877',GradientType=0 ); /* IE6-9 */
	color: #ffffff;
	font-size: 16px;
	border-radius: 5px;
	display: inline-block;
	margin-left: 5px;
	}
	
.headerButtons:hover{
	background: rgb(0,184,191); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,184,191,1) 0%, rgba(10,147,145,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,184,191,1)), color-stop(100%,rgba(10,147,145,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,184,191,1) 0%,rgba(10,147,145,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,184,191,1) 0%,rgba(10,147,145,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,184,191,1) 0%,rgba(10,147,145,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,184,191,1) 0%,rgba(10,147,145,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b8bf', endColorstr='#0a9391',GradientType=0 ); /* IE6-9 */
	color: #ffffff;
	font-size: 16px;
	border-radius: 5px;
	display: inline-block;
	margin-left: 5px;
	}
	
/* login */
#loginWrap{
	text-align: center;
	}
	
#login{
	border-radius: 5px;
	background-color: #fafafa;
	padding: 15px;
	width: 390px;
	margin-left: auto;
	margin-right: auto;
	border: 5px solid #00a3d0;
	position: relative;
	}
	
.formFieldsLogin{
	width: 387px;
	height: 28px;
	border: 1px solid #cccccc;
	border-radius: 2px;
	margin-top: 10px;
	font-family: Roboto;
	font-size: 16px;
	}
	
#loginButton{
	cursor: pointer;
	margin-left: auto;
	margin-right: 0px;
	margin-top: 10px;
	font-size: 20px;
	border-radius: 5px;
	background-color: #00a3d0;
	width: 162px;
	height: 32px;
	color: #ffffff;
	text-align: center;
	box-shadow: -1px 3px 10px 0px rgba(50, 50, 50, 0.75);
	text-shadow: -2px 2px 2px rgba(150, 150, 150, 1);
	}
	
/* recupera clave */
.recupera{
	position: absolute;
	width: 220px;
	font-size: 11px;
	color: #B0B0B0;
	transition:color 0.2s;
	-webkit-transition:color 0.2s;
	left: 0px;
	bottom: 5px;
	cursor: pointer;
	}
	
.recupera:hover{
	color:#969696;
	cursor: pointer;
	}
	
#password{
	position: absolute;
	top: -3px;
	left: -3px;
	width: 100%;
	height: 100%;
	background-color: #EDEDED;
	border: 3px solid #00A4D0;
	}
	
#titulorecupera{
	margin-top: 50px;
	color:#969696;
	font-size: 16px;
	}
	
#recuperaemail{
	width: 287px;
	height: 28px;
	border: 0px;
	outline: none;
	font-family: Roboto;
	font-size: 16px;
	padding-left: 10px;
	border: 1px solid #cccccc;
	}
	
#btnrecupera{
	cursor: pointer;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	font-size: 20px;
	border-radius: 5px;
	background-color: #00a3d0;
	width: 162px;
	height: 32px;
	color: #ffffff;
	text-align: center;
	box-shadow: -1px 3px 10px 0px rgba(50, 50, 50, 0.75);
	text-shadow: -2px 2px 2px rgba(150, 150, 150, 1);
	}
	
.cerrarRecupera{
	position: absolute;
	top: 5px;
	right: 15px;
	font-size: 25px;
	font-weight: 500px;
	color: #595959;
	}
	
.cerrarRecupera:hover{
	color: #CC0000;
	cursor: pointer;
	text-shadow: 0 0 0.5em #FF8080, 0 0 0.5em #FF8080,0 0 0.5em #FF8080;
	}
	
/* tool tips */
.tooltip{
	margin: 0px;
	padding: 0px;
	position: relative;
	}
	
.activeTooltip{
	background: rgb(0,158,220); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,158,220,1) 0%, rgba(0,186,239,1) 63%, rgba(0,143,213,0.7) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,158,220,0.7)), color-stop(63%,rgba(0,186,239,1)), color-stop(100%,rgba(0,143,213,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,158,220,1) 0%,rgba(0,186,239,1) 63%,rgba(0,143,213,0.7) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009edc', endColorstr='#008fd5',GradientType=0 ); /* IE6-9 */
	box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.59); 
	position: absolute; 
	z-index: 99999; 
	bottom: -30px; 
	padding: 5px; 
	text-align: center; 
	color: #ffffff;
	}
	
/* tutoriales */
#tutorialWrap{
	display: block;
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: 10px;
	bottom: -50px;
	color: #ffffff;
	text-align: center;
	padding: 0px;
	}

#tutorialHeaderImg{
	position: relative;
	margin: 0px;
	padding: 0px;
	}
	
	
#tutorial{
	width: 1000px;
	height: 500px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	background-color: #000000;
	color: #ffffff;
	text-align: center;
	font-size: 20px;
	font-weight: 500;
	position: relative;
	z-index: 9999;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	line-height: 1.7;
	display: none;
	}
	
#tutorialContent{
	height: 100%;
	width: 100%;
	background: #fbfbfb; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover,  #fbfbfb 0%, #fbfbfb 37%, #a5a7aa 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fbfbfb), color-stop(37%,#fbfbfb), color-stop(100%,#a5a7aa)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  #fbfbfb 0%,#fbfbfb 37%,#a5a7aa 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#a5a7aa',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
	
#closeTutorial{
	margin-left: 5px;
	margin-top: 10px;
	cursor: pointer;
	}
	
/* tiles */
 div.cosa{ 
    box-shadow: 0px 0px 7px 0px rgba(0, 109, 130, 0.8);
    }
	
/*lightboxes*/
#mainLightbox{
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(64,64,65,0.9);
	top: 0;
	left: 0;
	z-index: 999;
	display: none;
	}
	
#payLightbox{
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(64,64,65,0.9);
	top: 0;
	left: 0;
	z-index: 999;
	display: block;
	}
	
/* ventanas */
div.sombra  {
	border: 2px solid #087877;
	box-shadow: 0 0 3px 3px #848484;
    }