/**
* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
* http://cssreset.com
*/
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;display:block;}*{margin:0;padding:0;}html{display:block;}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;}

/* CSS FRAMEWORK */
strong,b{font-weight:bold;
}
cite,em,i{font-style:italic;
}
a:link{color:#0099cc;text-decoration:none;outline:none;transition:all 0.25s;-moz-transition:all 0.25s;-webkit-transition:all 0.25s;
}
a:visited{color:#0099cc;text-decoration:none;
}
a:hover{color:#006c8e;;text-decoration:none;
}
a img{border:none;border-width:0;outline:none;
}
abbr,acronym{border-bottom:1px dotted;cursor:help;
}
sup,sub{vertical-align:baseline;position:relative;top:-.4em;font-size:86%;
}
sub{top:.4em;}small{font-size:86%;
}
kbd{font-size:80%;border:1px solid #999;padding:2px 5px;border-bottom-width:2px;border-radius:3px;
}
mark{background-color:#ffce00;color:black;
}
p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:1.5em 0;
}
hr{height:1px;border:none;background-color:#666;
}
h1,h2,h3,h4,h5,h6{font-weight:bold;line-height:normal;margin:0 0 0.6em;
}
h1{font-size:200%
}
h2{font-size:180%
}
h3{font-size:160%
}
h4{font-size:140%
}
h5{font-size:120%
}
h6{font-size:100%
}
ol,ul,dl{margin:.5em 0em .5em 3em
}
ol{list-style:decimal outside
}
ul{list-style:disc outside
}
li{margin:.5em 0
}
dt{font-weight:bold
}
dd{margin:0 0 .5em 2em
}
input,button,select,textarea{font:inherit;font-size:100%;line-height:normal;vertical-align:baseline;
}
textarea{display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
}
pre,code{font-family:"Courier New",Courier,Monospace;color:inherit;
}
pre{white-space:pre;word-wrap:normal;overflow:auto;
}
blockquote{background:#f0f0f0;margin-left:2em;margin-right:2em;padding:1em 1em;font-style:italic;font-size:110%;
}
img {max-width:100%;height:auto;border:0;
}
iframe {max-width:100%;
}
table {border-collapse: collapse;border-spacing: 0;
}
.clear {clear:both;
}
.clear:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;
}

@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}

body {
    margin:0 auto;
    font-family:Arial, sans-serif;
    font-size:15px;
    line-height:1.6em;
    color:#333;
    background:#fff;
    overflow-x:hidden;
}
#header-content {
    margin: auto;
    width: 100%;
    line-height: 60px;
    height: 60px;
    overflow: hidden;
    background-color: rgba(9,132,227,.95);
}
#top-wrapper {
    height: 80px;
    width: 900px;
    margin: auto;
    position: relative;
}
#logo {
    float: left;
    max-height: 100%;
    min-height: 50px;
    min-width: 260px;
    max-width: 10%;
    margin-right: 18px;
}
#logo a {
    font-size: 22px;
    text-transform: uppercase;
    float: left;
    color: #fff;
}
#logo h1 {
    float: left;
    margin-top: 20px;
}
#logo img { float: left 
}

.demo {
    float: right;
	font-weight: bold;
    font-size: 14px;
    color: rgba(255,255,255,1);
}
.container {
	width:900px;
	margin:20px auto;
	padding:0 0 30px;
}
.container  .img-center {
	margin:0 auto;
	text-align:center;
}


h2.doc-subtitle {
    background: #7ed6df;
	background:linear-gradient(-50deg,#ee5952,#ea3a7e,#20aadb,#23e0b3);background-size:320% 200%;animation:Gradient 15s ease infinite;
    color: #fff;
    font-size: 22px;
    margin: 30px 0 20px;
    padding: 10px 15px;
    border-radius: 2px;
}

.note-green { 
	margin: 1.5em 0;
	padding:16px;
	background-color:#D3F5D3;
	color:#159415;
}
.note-yellow { 
	margin: 1.5em 0;
	padding:12px;
	background-color:#fcf8e3;
	color:#b58d47;
}
.note-red { 
	margin: 1.5em 0;
	padding:16px;
	background-color:#FCAFAF;
	color:#C92121;
}
.mark-green { background-color:#A4DDA4 !important;padding:2px 6px;border-radius:2px;color:#fff}
.mark-blue { background-color:#A1DAFF !important;padding:2px 6px;border-radius:2px;color:#fff}
.mark-red{background-color:#ff7979!important;padding:2px 6px;border-radius:2px;color:#fff}
.mark-black { background-color:#333333 !important;padding:2px 6px;border-radius:2px;color:#fff}
.mark-gray { background-color:#EEEEEE !important;padding:2px 6px;border-radius:2px;color:#fff}
.mark-yellow { background-color:#E4E437 !important;padding:2px 6px;border-radius:2px;color:#fff}



/* back to top */
#back-to-top {
    display: inline-block;
    background: #ff7979;
    color: #fff;
    padding: 10px 16px;
    font-size: 14px;
    border-radius: 3px;
}
.back-to-top {
	position:fixed !important;
	position:absolute;
	bottom:10%;
	right:30px;
	z-index:999;
}

footer {
    margin: auto;
    padding: 40px 0;
    width: 100%;
    background-color: #F5F5F5;
    text-align: center;
}

pre{white-space:pre;word-wrap:normal;overflow:auto;font-size:14px;margin:0;padding:0}
hr{margin-top:2rem;background:#ccc;height:1px;border:0;margin-bottom:2rem}
code{padding:1.2em}
pre{padding:0;border-radius:3px;background-color:#202a34;color:#fff;padding:0;word-spacing:normal;word-break:normal;line-height:1.4em}
.hljs{display:block;overflow-x:auto;padding:1.2em;background:#202a34;color:#fff;line-height:1.5;text-align:left;word-spacing:0;font-family:monospace;border-radius:3px}
.hljs-name,.hljs-strong{font-weight:bold}
.hljs-code,.hljs-emphasis{font-style:italic}
.hljs-tag{color:#62c8f3}
.hljs-variable,.hljs-template-variable,.hljs-selector-id,.hljs-selector-class{color:#ade5fc}
.hljs-string,.hljs-bullet{color:#a2fca2}
.hljs-type,.hljs-title,.hljs-section,.hljs-attribute,.hljs-quote,.hljs-built_in,.hljs-builtin-name{color:#ffa}
.hljs-number,.hljs-symbol,.hljs-bullet{color:#d36363}
.hljs-keyword,.hljs-selector-tag,.hljs-literal{color:#fcc28c}
.hljs-comment,.hljs-deletion,.hljs-code{color:#888}
.hljs-regexp,.hljs-link{color:#c6b4f0}
.hljs-meta{color:#fc9b9b}
.hljs-deletion{background-color:#fc9b9b;color:#333}
.hljs-addition{background-color:#a2fca2;color:#333}
.hljs a{color:inherit}
.hljs a:focus,.hljs a:hover{color:inherit;text-decoration:underline}
mark .hljs-attr,mark .hljs-string,mark .hljs-bullet{background-color:#e67e22;color:#fff}
.hljs mark{background-color:#f24a4a;color:#fff;padding:2px 5px;border-radius:2px}
.hljs mark span.hljs-number,.hljs mark span.hljs-comment,.hljs mark span.hljs-symbol,.hljs mark span.hljs-string,.hljs mark span.hljs-attr,.hljs mark span.hljs-keyword,.hljs mark span.hljs-name,.hljs mark span.hljs-tag{color:#fff;margin:.15rem 0}