@charset "ISO-8859-1";
#errorMsgBox, .ui-dialog .ui-dialog-title{
	white-space: pre-wrap;
	_font-size: 11pt;
	_font-weight: bold;
}

#errorMsgBoxContent, .ui-dialog .ui-dialog-content{
	_font-size: 10pt;
	_font-weight: normal;
	_text-align: center;
	_padding-top: 2px;
	_padding-bottom: 2px;
	padding-left: 20px;
	padding-right: 20px;
}
#score {
	position:absolute;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	display: flex;
    align-items: center;
	justify-content: center;
	font-weight: bold;
}
#scorebar {
	background-image: url(../img/bg_strength_gradient.jpg);
	background-size: auto 50px;
	position:absolute;
	top: 0;
	width: calc(100% - 4px);
	height: calc(100% - 4px);
	border: 2px solid;
}

ul.icon li { 
   	position: relative;
   	display: flex;
   	align-items: center;
}
ul.icon li:before {
	content: ''; 
   	display: inline-block;
   	position: absolute;
   	left: -16px;
   	height: 16px; width: 16px;
}
li.okIcon:before { 
	background: url(jquery/themes/redmond/images/ui-icons_217bc0_256x240.png) -66px -144px;
}
li.errorIcon:before {
   	background: url(jquery/themes/redmond/images/ui-icons_cd0a0a_256x240.png) -82px -128px;
}

ul.okIcon {
    list-style: none; /* This removes the default bullets */
   _padding-left: 20px; /* This provides proper indentation for your icons */
}
ul.okIcon li { 
   	position: relative; /* Allows you to absolutely place the :before element relative to the <li>'s bounding box. */
}
ul.okIcon li:before {
   	background: url(jquery/themes/redmond/images/ui-icons_217bc0_256x240.png) -66px -144px;
  		/* ex: download.jqueryui.com/themeroller/images/ui-icons_888888_256x240.png */
  		/* The -144px, -96px coordinate is the location of the 16x16 Person icon */

   	/* The next 2 lines are necessary in order to make the :before pseudo-element appear, and thereby show it's background, your icon. */
	content: ''; 
   	display: inline-block;

   	/* Absolute is always in relation to the nearest positioned parent. In this case, that's the <li> with _relative_ positioning, above. */
   	position: absolute;

   	left: -16px; /* Places the icon 16px left of the <li>'s edge */
   	top: 2px;    /* Adjust this based on your font-size and line-height */

   	height: 16px; width: 16px; /* jQuery UI icons (with spacing) are 16x16 */
}

ul.errorIcon {
    list-style: none; /* This removes the default bullets */
    _padding-left: 20px; /* This provides proper indentation for your icons */
}

ul.errorIcon li { 
   	position: relative; /* Allows you to absolutely place the :before element relative to the <li>'s bounding box. */
}

ul.errorIcon li:before {
   	background: url(jquery/themes/redmond/images/ui-icons_cd0a0a_256x240.png) -82px -128px;
  		/* ex: download.jqueryui.com/themeroller/images/ui-icons_888888_256x240.png */
  		/* The -144px, -96px coordinate is the location of the 16x16 Person icon */

   	/* The next 2 lines are necessary in order to make the :before pseudo-element appear, and thereby show it's background, your icon. */
	content: ''; 
   	display: inline-block;

   	/* Absolute is always in relation to the nearest positioned parent. In this case, that's the <li> with _relative_ positioning, above. */
   	position: absolute;

   	left: -16px; /* Places the icon 16px left of the <li>'s edge */
   	top: 2px;    /* Adjust this based on your font-size and line-height */

   	height: 16px; width: 16px; /* jQuery UI icons (with spacing) are 16x16 */
}

.ui-draggable, .ui-droppable {
	background-position: top;
}

.ui-tooltip, .arrow:after {
	_background: #DFC278;
	_background: #FFEC8B;
	background: #F0F0F0;
	border: 1px solid white;
}
.ui-tooltip {
	_padding: 10px 20px;
	_color: white;
	_border-radius: 20px;
	_font: bold 14px "Helvetica Neue", Sans-Serif;
	_text-transform: uppercase;
	box-shadow: 0px 0px 6px black;
	font-family: sans-serif;
	font-style: italic;
	font-size: 8pt;
	padding: 3px;
	border-bottom-right-radius: 1px;
	border-bottom-left-radius: 1px;
	border-top-right-radius: 1px;
	border-top-left-radius: 1px;
}
.arrow {
	width: 70px;
	height: 16px;
	overflow: hidden;
	position: absolute;
	left: 50%;
	margin-left: -35px;
	bottom: -16px;
}
.arrow.top {
	top: -16px;
	bottom: auto;
}
.arrow.left {
	left: 20%;
}
.arrow:after {
	content: "";
	position: absolute;
	left: 20px;
	top: -20px;
	width: 25px;
	height: 25px;
	box-shadow: 6px 5px 9px -9px black;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	tranform: rotate(45deg);
}
.arrow.top:after {
	bottom: -20px;
	top: auto;
}
.ajax_main_overlay {
	background: #aaaaaa 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30);
}
.ajax_overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ajax_loader {
	aabackground: url("dimg/spinner_squares_circle.gif") no-repeat center center transparent;
	width:100%;
	height:100%;
}

.ajax_message1 {
	height:47%
}

.ajax_message2 {
	height:6%; 
	_background: url("img/ajax-loader_blue.gif") no-repeat; 
	margin-left:300px; 
	margin-right:300px; 
	background-color: white; 
	text-align: center; 
	vertical-align: middle;
	border: solid;
	border-color: #888888;
	border-width: 1px;
	padding-top: 10px;
	padding-bottom: 15px;
	font-style: italic;
	box-shadow: 0px 0px 6px black;
}

p, .ajax_message2 {
	color: black;
}

.ajax_message3 {
	height:47%
}

#accordionPasswordPolicy {
	margin-right: 2em;
	margin-left: 1em;
	height: inherit;
}

#accordionPasswordPolicy-resizer {
	padding: 0px;
	width: 450px;
	height: 230px;
	border: none;
}	

.radioAmpliaAccesos_tooltip {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted black;*/
}

.radioAmpliaAccesos_tooltip .radioAmpliaAccesos_tooltiptext {
  visibility: hidden;
  width: 200px;
  background-color: #DFEFFC;
/*	background-color: #FFFFFF;*/
	border: 1px solid #C5DBEC;
	color: #2E6E9E;
/*  color: #000;*/
/*  text-align: center;*/
  	text-align: left;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -105px; /*Para centrar el tooltip*/
  opacity: 0;
  transition: opacity 0.3s;
  padding: 5px;
  font-weight: 510;
}

.radioAmpliaAccesos_tooltip .radioAmpliaAccesos_tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #C5DBEC transparent transparent transparent;
}

.radioAmpliaAccesos_tooltip:hover .radioAmpliaAccesos_tooltiptext {
  visibility: visible;
  opacity: 1;
}