.ace-onpage-help-backdrop {
 position: absolute;
 z-index: 99990;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0D000000', endColorstr='#0D000000',GradientType=0 );
 background-color: transparent;
 background-color: rgba(0,0,0,0.05);
}

.ace-toggle-onpage-help:focus {
 outline: none;
}
.ace-help-container {
 position: fixed;
 top: 135px;
}
.ace-help-container.active {
 z-index: 100001;
}


@media (min-width: 768px) {
 .main-container.container ~ .ace-onpage-help-container .ace-help-container {
   right: auto;
   margin-left: 690px;
 }
}
@media (min-width: 992px) {
 .main-container.container ~ .ace-onpage-help-container .ace-help-container {
	right: auto;
	margin-left: 910px;
 }
}
@media (min-width: 1200px) {
 .main-container.container ~ .ace-onpage-help-container .ace-help-container {
	right: auto;
	margin-left: 1110px;
 }
}



.ace-toggle-help-text {
  -moz-animation:    pulsating 2s 2 linear 1s;
  -webkit-animation: pulsating 2s 2 linear 1s;
  -o-animation:      pulsating 2s 2 linear 1s;
  -ms-animation:     pulsating 2s 2 linear 1s;
  animation:         pulsating 2s 2 linear 1s;
}


.ace-onpage-help {
 position: absolute;
 z-index: 100000;
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4DFFFFFF', endColorstr='#4DFFFFFF',GradientType=0 );
 background-color: transparent;
 background-color: rgba(255,255,255,0.3);
 
 border: 1px dashed #8BBCD3;
 border-radius:4px;
 
 transition: background-color 0.2s, border-color 0.2s;
 -webkit-transition: background-color 0.2s, border-color 0.2s;
 
 text-align: center;
 vertical-align: middle;
 
 outline: none !important;
}
.ace-onpage-help:focus , .ace-onpage-help:active {
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33C9D8EA', endColorstr='#33C9D8EA',GradientType=0 );
 background-color: transparent;
 background-color: rgba(201,216,234,0.2);
 border-color: #77ACC4;
}
.ace-onpage-help:hover {
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66C9D8EA', endColorstr='#66C9D8EA',GradientType=0 );
 background-color: transparent;
 background-color: rgba(201,216,234,0.4);
 border-color: #77ACC4;
 border-style: solid;
}

.ace-onpage-help:after {
 font-family: FontAwesome;
 font-size: 36px;
 content: "\f128";
 display: inline-block;
 position: absolute; z-index: 1;
 

 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 
 opacity: 0;
 filter:alpha(opacity=0);
 
 color: #FFF;
 text-shadow: 0 0 2px black;
 
 
 background-color: #85B8DB;
 border: 2px solid #FFF;
 border-radius: 100%;
 box-shadow: 0 0 2px 1px rgba(0,0,0,0.4);
 width: 48px;
 height: 48px;
 line-height: 46px;
 
  transition: opacity 0.2s;
 -webkit-transition: opacity 0.2s;

}

.ace-onpage-help:focus:after , .ace-onpage-help:active:after {
 opacity: 0.5;
}
.ace-onpage-help:hover:after  {
 opacity: 1;
 filter:alpha(opacity=100);
}

.ace-onpage-help.smaller:after {
 font-size: 18px;
 width: 28px;
 height: 28px;
 line-height: 26px;
 border-radius: 12px;
}
.ace-onpage-help.smallest:after {
 font-size: 14px;
 width: 20px;
 height: 20px;
 line-height: 17px;
 border-radius: 8px;
}

.ace-onpage-help:before {
 position: absolute; z-index: 2;
 left: -4px;
 top: -4px;
 width: 18px;
 height: 18px;
 line-height: 16px;

 display: block;
 
 font-family: FontAwesome;
 font-size: 16px;
 content: "\f0eb";
 color: #F7D54C;
 color: orange;
 
 background-color: #FFF;
 border:1px solid #EAD05D;
 border:1px solid orange;
 
 border-radius: 4px;
 opacity: 1;
  
  transition: all 0.2s;
 -webkit-transition: all 0.2s;
}
.ace-onpage-help:hover:before {
 color: #59A34E;
 border-color: #59A34E;
 transform: scale(1.25);
 -webkit-transform: scale(1.25);
}


.onpage-help-modal {
 z-index: 100010;
} 
.onpage-help-modal + .modal-backdrop {
 z-index: 100009;
}






.onpage-help-content pre .close {
	float: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	opacity: inherit;
	text-shadow: inherit;
}
.onpage-help-content .widget-box  {
 margin-bottom: 16px;
}
.onpage-help-content  .widget-box > .widget-header > .info-title {
	cursor: pointer;
}
.onpage-help-content  .widget-box > .widget-header > .info-title:hover {
	background-color: #DCE8F1;
}
		
		
.modal-buttons  button{
 border-radius: 100%;
 border-width: 2px !important;
}
.modal-buttons  button:focus {
 outline: none !important;
}
.modal-buttons  button.disabled {
 transform: scale(0.9);
 -webkit-transform: scale(0.9);
}



.onpage-help-content {
	max-width: 800px;
	margin: 0 auto;
}
.onpage-help-content .help-content + .hr {
    border-style: dotted;
    border-width: 0 0 1px;
    margin: 24px 0;
}

.help-content {
	background-color: #FFF;
	padding: 12px 24px;
	border:1px solid #C5D0DC;
}
.help-content > .widget-box > .widget-header > .info-title {
	cursor: pointer;
}
.help-content > .widget-box > .widget-header > .info-title:hover {
	background-color: #DCE8F1;
}
.help-content > .widget-box.collapsed > .widget-header {
	border-bottom-width: 0;
}

.help-content > .widget-box {
	border-bottom: 1px solid #DCE8F1;
	margin-bottom: 10px;
	padding-bottom: 5px;
	transition: none;
}
.help-content > .widget-box.collapsed {
	padding-bottom: 10px;
	transition: padding-bottom 0.1s;
}
.help-content > .widget-box:last-child {
	border-bottom-width: 0;
	margin-bottom: 0;
}

.help-content > .widget-box:only-child {
	padding-bottom: 0;
	padding-bottom: 5px;
}


.info-list {
	margin: 0;
}
.info-list > li:nth-child(odd) > .ace-icon:first-child {
	color: #478FCA;
}
.info-list > li:nth-child(even) > .ace-icon:first-child {
	color: #69AA46;
}
.info-list > li:not(.hr) {
	margin-top: 0;
	margin-bottom: 0;
	padding: 16px 12px;
	line-height: 22px;
}
.info-list > li:not(.hr):nth-child(even) {
	background-color: #FFF;
	border: 1px solid #E9E9E9;
}
.info-list > li:not(.hr):nth-child(odd) {
	background-color: #F0F4F9;
}

.info-list > li:not(.hr):nth-child(even)  code
{
	background-color: #F0F4F9;
}
.info-list > li:not(.hr):nth-child(odd)  code
{
	background-color: #FFF;
}


.help-more {
	color: #425663;
	border-bottom: 1px dotted #AAA;
	padding-bottom: 1px;
}
.help-more:hover {
	text-decoration: none;
	border-bottom-color: #628DB2;
	background-color: #E4EAC7;
}

u.dotted {
	text-decoration: none;
	border-bottom: 1px dotted #999;
}


pre .close {
	float: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	opacity: inherit;
	text-shadow: inherit;
}

.open-file {
	cursor: pointer;
	-webkit-transition: all 0.12s;
	transition: all 0.12s;
}
.open-file:hover {
	background-color: #CEE0EA !important;
}
.open-file .brief-show {
	display: none;
}
.open-file:hover .brief-show {
	display: inline;
}

.code-modal .modal-dialog {
	margin-top: 6px;
	margin-bottom: 6px;
}
.code-modal .modal-header {
	padding-top: 6px;
	padding-bottom: 6px;
}
.code-modal .modal-body {
	padding: 10px 12px
}


.onpage-help-modal pre {
	border-width: 0;
	box-shadow: none;
	border-radius: 0;
	margin-top: 8px;
}

.onpage-help-modal .modal-title code {
 font-size: 13px;
}

.onpage-help-modal .modal-body {
 font-size: 14px;
}


.onpage-help-modal a[href^="http"]:before {
   font-family: FontAwesome;
   font-size: 15px;
   content: "\f08e";
   display: inline;
   margin-right: 3px;
}