/* BASE */
html{
font-family: Roboto, "Segoe UI", -apple-system, BlinkMacSystemFont, Arial, Helvetica, sans-serif;
line-height: 1.25; 
-ms-text-size-adjust: 100%; 
-webkit-text-size-adjust: 100%;
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
 box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
   -webkit-box-box-sizing: inherit;
    -moz-box-sizing: inherit;
}
body{
	 margin: 0;
	 color: #151515;
	 font-size: 16px;
}
h1, h2, h3, h4, h5, h6 {
	margin: 16px 0;
	font-family:  inherit;
	 font-weight: bold;
	  display: block; 
	  line-height: inherit;
}
h1 {	
 font-size: 2em; 
}
h2 {
	font-size: 1.75em;	
}
h3 {
	font-size: 1.5em;	
}
h4 {
 	 font-size: 1.25em;	
}
h5 {
	 font-size: 1em;
}
h6 {
	font-size: 0.75em;	 
}
p {
	 margin: 16px 0 16px 0;
}
hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
height: 0;
overflow: visible;
margin: 16px 0;
border: 0;
border-top: 1px solid #B5B4B4;
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
}
address{
margin: 16px 0;
font-style: normal;
}
cite {
	font-style: inherit;	
}
em{
	font-style: normal;
	font-weight: bold;
}
strong{
	font-weight: bold;
}
code, samp{
    overflow: auto;
	    display: inline;
font-family:  monospace;
    padding: 0 0.55em;
	
    background-color: #262626;
    color: #fff;
font-weight: bold;	
}
pre > code {
	border: none;
	  padding: 0px;
	  margin: 0;
	  display: inline-block;
	  font-weight: bold;
}
kbd{
	 padding: 0 0.55em;
	 
    background-color: #262626;
    color: #fff;
    border-radius: 2px;
	font-family:  monospace; 
	font-weight: bold;
}
pre{
	overflow: auto;
    max-width: 100%;
        display: inline-block;
    margin: 16px 0;
    word-break: break-all;
    word-wrap: break-word;
	font-family: monospace; 
}
q {
	font-style: italic;
}
blockquote {
	    padding: 12px 8px;
    margin: 0;
	 
    background-color: #f9f9f9;
}
blockquote > p:before {
    content: open-quote;
}
blockquote > p:after {
    content: close-quote;
}
blockquote > cite {
  font-style: italic;
}
small {
	font-size: 75%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
input{
	margin: 0;
	overflow: visible;
	font-family:  inherit;
}
input[type=text], input[type=password], input[type=email], input[type=number], input[type=url] {
	border: none;
    padding: 0 8px;
	
    box-shadow: 0px 0px 0 1px #B5B4B4;
    -webkit-box-shadow: 0px 0px 0 1px #B5B4B4;
    -moz-box-shadow: 0px 0px 0 1px #B5B4B4;
	font-size: inherit;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=number]:focus, input[type=url]:focus {
   outline: none;
border: none;

box-shadow: 0px 0px 0 1px #858585;
    -webkit-box-shadow: 0px 0px 0 1px #858585;
    -moz-box-shadow: 0px 0px 0 1px #858585;
}
input[type=button], input[type=reset], input[type=submit], button  {
	-webkit-appearance: button;
    text-transform: none;
    font-weight: bold;
    background-color: #fff;
    color: #262626;
    border: none;
	
        box-shadow: 0px 0px 0 1px #B5B4B4;
    -webkit-box-shadow: 0px 0px 0 1px #B5B4B4;
    -moz-box-shadow: 0px 0px 0 1px #B5B4B4;
	cursor: pointer;
	font-size: inherit;
}
input[type=button]:focus, input[type=reset]:focus, input[type=submit]:focus, button:focus  {
 outline: none;
border: none;
opacity: 0.7;
cursor: default;
}
textarea {
	font-size: inherit;
	font-family:  inherit;
	margin: 0;
    overflow: auto;
    box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	
box-shadow: 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 0px 0 1px #dadada;

border: none;	
}
textarea:focus { 
  outline: none;
border: none;
box-shadow: 0px 0px 0 1px #a9a9a9;
    -webkit-box-shadow: 0px 0px 0 1px #a9a9a9;
    -moz-box-shadow: 0px 0px 0 1px #a9a9a9;
}
button {
	-webkit-appearance: button;
	   text-transform: none;
		   margin: 0;
	overflow: visible;
	font-family:  inherit;
	font-size: inherit;
}
select {
	font-family:  inherit;
margin: 0;
text-transform: none;
border: 1px solid #B5B4B4;
border-radius: 0.12em;
vertical-align: middle;
font-size: inherit;
}
select:focus {
outline: none;

border: 1px solid #858585;
}

optgroup{
	margin: 0;
	font-style: normal;
}
fieldset {
	    display: block;
    border-width: 1px;
    border-style: solid;
}
iframe {
	   border-width: 1px;
    border-style: inset; 
	max-width: 100%;
}
img {
	border-style: none;
	    height: auto;
    max-width: 100%;
}
canvas {
  display: inline-block;
}
figure, figcaption{
	    display: block;
		margin: 0;
}
audio, video {
  display: inline-block;
  max-width: 100%;
}
a {
	
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
    text-decoration: none;
	
}
a:hover, a:focus {
    text-decoration: underline;
		
}
nav {
	display: block;
}
dt {
	font-weight: bold;
}
dd {
	margin: 0 0 16px;
}
dd:last-child {
	margin: 0;
}

table {
	max-width: 100%;
}
th {

	font-weight: bold;
}

th,
td {
	padding: .4375em .875em;

}
table {  
    position: relative;
    z-index: 1;
	overflow: auto;
    
}
table th {
    text-align: left;
}
table th,
table td {  
    vertical-align: middle;
}
header, footer, main, section, article, aside {
	 display: block;
}
svg {
	 -webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none;
    user-select: none;
}

/* LAYOUT */
body {
margin: 0px;
background-color: #fff; 
}
.doc-header, .doc-navigation{
width: 100%;
border-bottom: 1px solid #eaeaea;
min-height: 50px;
-webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none;
}
.doc-navigation {
	background-color: #fbfbfb;
}
.doc-footer {
border-top: 1px solid #eaeaea;
width: 100%;
    background-color: #fbfbfb;
clear: both;
min-height: 50px;
-webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none;
	padding: 0px 16px;
}
.doc-main {
    background-color: #fff; 
    width: 1000px;
    margin: auto;
box-shadow: 1px 0px 0px 0px #eaeaea, -1px 0px 0 0px #eaeaea;
min-height: 718px;	
}
.header-inner, .navigation-inner, .footer-inner {
	     width: 1000px;
    margin: 0px auto;
    white-space: nowrap;
	 position: relative;
	 overflow-x: auto;
	 overflow-y: hidden;
}
.slide-hint::after {
    content: "More \2192";
    position: absolute;
    font-size: x-small;
	right: 0;
	font-weight: bold;
	bottom: 0;
	overflow-y: hidden;
	opacity: 0.5;
}
.header-link, .navigation-link {
    vertical-align: middle;
    display: inline-block;
    height: 50px;
    line-height: 50px;
	margin-right: 12px;
	font-weight: bold;
}
.header-link:last-child, .navigation:last-child{
	margin-right: 0;
}
.header-link-logo {
	vertical-align: middle;
}
.header-link.mobile-only, .navigation-link.mobile-only {
display: none;	
}
.footer-link-list li {
    margin-bottom: 16px;
}
.footer-link-list li:last-child {
    margin-bottom: 0;
}
.footer-inner {
padding-top: 16px;
padding-bottom: 16px;
}
.doc-footer a, .doc-header a {
font-weight: bold;
}

/* WEB COMPONENTS */
.button {
  overflow: visible;
  display: inline-block;
  text-align: center;
  text-decoration: none;
   border-radius: 0.20em;
    font-weight: bold;
	background-color: #fff;
  color: #262626;
  border: none;
  font-size: inherit;
	    box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
	-webkit-box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
	-moz-box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
   } 
   .button:hover {
	cursor: pointer;
	opacity: 0.7;
}
.button:focus, .button:disabled  {
cursor: auto;
	  outline: none;
	    opacity: 0.7;
}
.grid, .grid [class^="grid-"] {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.grid, .grid-row {
overflow: hidden;
}
.grid-row {
width: 100%;
}
.grid-row [class^=grid-col-]{
float: left;
display: inline-block;
overflow: hidden;
}
.grid-row::after { 
   content: " ";
   display: block; 
   clear: both;  
}
.grid-col-one {
width: 8.333333333333334%; 
}
.grid-col-two {
width: 16.666666666666668%; 
}
.grid-col-three {
width: 25%;  
}
.grid-col-four {
width: 33.333333333333336%;
}
.grid-col-five {
width: 41.66666666666667%;
}
.grid-col-six {
width: 50%; 
}
.grid-col-seven {
width: 58.333333333333336%;
}
.grid-col-eight {
width: 66.66666666666667%;
}
.grid-col-nine {
width: 75%; 
}
.grid-col-ten {
width: 83.33333333333334%; 
}
.grid-col-eleven {
 width: 91.66666666666667%; 
}
.grid-col-twelve {
width: 100%;
}
.search  {
width: 100%;
line-height: 36px;
	height: 36px;
	font-size: 16px;
 font-size: inherit;
  display: inline-block;
	  background-color: #fff;
  box-shadow: 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 0px 0 1px #dadada;
	position: relative;
	font-family: inherit;
	 color: #262626;
	  border-radius: 0.06em; 
}
.search-input, .search-el{ 
display: inline-block;
    vertical-align: middle;
	 padding: 0 12px;
    box-sizing: border-box;
    margin: 0;
	outline: none;
	 background: transparent;
	 overflow: hidden;
	 font-size: inherit;
	 font-family: inherit;
	 box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

.search-input {
    color: inherit;
	border: none;
	width: 100%;
	position: absolute; 	 
height: inherit;
    line-height: inherit;
	    left: 0;
  
}
.search-els{
	 float: right;
	 font-family: inherit;
}
.search-el{ 
    color: inherit;
    border: none;
	cursor: pointer;
		    height: inherit;
    line-height: inherit;
    position: relative;
	float: right;
}

.search-input:focus {
box-shadow: 0px 0px 0 1px #B5B4B4;
    -webkit-box-shadow: 0px 0px 0 1px #B5B4B4;
    -moz-box-shadow: 0px 0px 0 1px #B5B4B4;
}
.search-input:disabled  {
opacity: 0.6;
}

.modal {
position: fixed;
display: none;
z-index: 2147483647;
    background: rgba(0, 0, 0, 0.82);
    right: 0;
    left: 0;
	top: 0;
	bottom: 0;
	 outline: 0;
overflow: auto;		 
 }
.modal.modal-light {
background: rgba(255, 255, 255, 0.82);	 
}
.modal .modal-content{
  position: relative;
  top: 16px;
    display: block;
    border-radius: 0.12em;
    background: #fff;
    margin: auto;
    box-shadow: 0 5px 8px rgba(0,0,0,.5);
    -webkit-box-shadow: 0 5px 8px rgba(0,0,0,.5);
    -moz-box-shadow: 0 5px 8px rgba(0,0,0,.5);
}
.modal-body {
padding: 16px;
    overflow: hidden;
}
.modal.modal-show {
display: block;
}
html.modal-active {
overflow: hidden;
}
.modal-close {
display: inline-block;
}

/* ALERT */
.alert {
        display: block;
    position: relative;
    padding: 0 18px;
    border-radius: 0.10em;
    color: #fff;
    background-color: #6b0ae4; /* THEME COLOR */
    border: 1px solid #6b0ae4; /* THEME COLOR */
    padding-right: 24px;
    line-height: 50px;
    font-weight: bold;
}
.alert .alert-close {
    cursor: pointer;
    font-size: inherit;
        font-family: monospace;
    margin: 0 8px;
    color: inherit;
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    bottom: 0;
    background-color: inherit;
	vertical-align: middle;
    line-height: inherit;
	-webkit-user-select: none; 
  -ms-user-select: none; 
  user-select: none; 
}
.alert .alert-close:hover { 
  opacity: 0.8;
}
.alert.alert-error {
	    color: #fff;
		background-color: #f10000;
		border: 1px solid #f10000;
}
.alert.alert-warning {
	color: #fff;
		background-color: #d4a009;
		border: 1px solid #d4a009;
}
.alert.alert-success {
	color: #fff;
		background-color: #389400;
		border: 1px solid #389400;
}

.input-text {
	width: 100%;
	line-height: 36px;
	height: 36px;
    vertical-align: middle;
    margin: 0;
    border-radius: 0.12em;
    background: #fff;
    color: #545454;
    border: none;
	font-size: inherit;
	padding: 0 12px;
	box-shadow: 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 0px 0 1px #dadada;

}
.input-text:focus {
outline: none;
border: none;
box-shadow: 0px 0px 0 1px #B5B4B4;
    -webkit-box-shadow: 0px 0px 0 1px #B5B4B4;
    -moz-box-shadow: 0px 0px 0 1px #B5B4B4;
}
.input-text:disabled  {
opacity: 0.6;
}

.input-radio , .input-checkbox, .input-radio label , .input-checkbox label {
display: inline-block;
cursor: pointer;
-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.input-radio input[type="radio"], .input-checkbox input[type="checkbox"]{
	display: none;
}

.input-radio label::before, .input-checkbox label::before{
cursor: pointer;
display: inline-block;
    height: 16px;
    width: 16px;
	 background-size: 16px 16px;
    overflow: hidden; 
content: "";
    vertical-align: middle;
    margin-top: -4px;
background-repeat: no-repeat;
   
}
.input-radio label::before {
background-image: url("data:image/svg+xml,%0A%3Csvg%20fill%3D%22%23545454%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm0%2018c-4.42%200-8-3.58-8-8s3.58-8%208-8%208%203.58%208%208-3.58%208-8%208z%22%3E%3C%2Fpath%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E");
}
.input-checkbox label::before{
background-image: url("data:image/svg+xml,%0A%3Csvg%20fill%3D%22%23545454%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M19%205v14H5V5h14m0-2H5c-1.1%200-2%20.9-2%202v14c0%201.1.9%202%202%202h14c1.1%200%202-.9%202-2V5c0-1.1-.9-2-2-2z%22%3E%3C%2Fpath%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E");
}
.input-radio input[type="radio"]:checked + label::before {
background-image: url("data:image/svg+xml,%0A%3Csvg%20fill%3D%22%23545454%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M12%207c-2.76%200-5%202.24-5%205s2.24%205%205%205%205-2.24%205-5-2.24-5-5-5zm0-5C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm0%2018c-4.42%200-8-3.58-8-8s3.58-8%208-8%208%203.58%208%208-3.58%208-8%208z%22%3E%3C%2Fpath%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E");
}
.input-checkbox input[type="checkbox"]:checked + label::before  {
background-image: url("data:image/svg+xml,%0A%3Csvg%20fill%3D%22%23545454%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%3E%3C%2Fpath%3E%0A%20%20%20%20%3Cpath%20d%3D%22M19%203H5c-1.11%200-2%20.9-2%202v14c0%201.1.89%202%202%202h14c1.11%200%202-.9%202-2V5c0-1.1-.89-2-2-2zm-9%2014l-5-5%201.41-1.41L10%2014.17l7.59-7.59L19%208l-9%209z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E");
}

.tabs {
overflow: auto;
overflow-y: hidden;
color: #262626;
    white-space: nowrap;
    display: inline-block;
	position: relative;
	max-width: 100%;
	    font-size: 16px;
		
		
	
}
.tabs-item {
display: inline-block;
padding: 0px 18px 0px 18px;
line-height: 40px;
    height: 40px;
    vertical-align: middle;
	cursor: pointer;
	border-bottom: 2px solid #e5e5e5;
	box-sizing: border-box;
		-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none; 
    user-select: none;
	opacity: 0.8;
	color: inherit;
	text-decoration: none;

}
.tabs-item:hover,  .tabs-item:focus{
opacity: 1;
text-decoration: none;
}
.tabs-item-active {
border-bottom: 2px solid #262626;
opacity: 1;
}

.pagination-input {
display: block;
-webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none;
	overflow: auto;
    white-space: nowrap;
	font-size: small;
}
.pagination-input .page {
padding: 8px;
background-color: transparent;
    text-decoration: none;
	font-weight: 700;
	border-radius: 0.16em;
	cursor:pointer; 
	display: inline-block;
}
.pagination-input [class^="page page-"] {
background-color: #545454;
color: #fff;
}
.pagination-input input.page {
	width: 48px;
    text-align: center;
	 border: 1px solid #B5B4B4;
	box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
	cursor:auto; 
}

.table  {
display: inline-block;
font-family: inherit;
color: inherit;
overflow: auto;
border-collapse: collapse;
 width: 100%;
 font-size: medium;
 
 
}
.table table {
 background-color: #ffffff;
    width: inherit;
 border-collapse: collapse;	
}
.table th {
	font-weight: bold;
	text-align: left;
	white-space: nowrap;
	padding: 12px 8px;
	
}
.table thead th {
font-size: 110%;
}
.table tr, .table td {
	padding: 12px 8px;
	white-space: nowrap;
	
}   
.table td, .table th {
	      box-shadow: 1px 0px 0px 0px #dadada;
		      overflow: hidden;
	
}
.table td:last-child, .table th:last-child {
	      box-shadow: 1px 0px 0px 0px transparent;
	
}
.table tbody tr, .table thead { 
    border-bottom: 1px solid #dadada;   
}
.table thead tr{
background-color: transparent;
border: none;
}
.table .table-highlight{
	font-weight: bold;
}
.table thead {
color: #fff;
background-color: #545454;
}
.table tfoot {
background-color: #f9f9f9;
font-weight: bold;
}

.toggle-switch {
display: inline-block;
-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	
}
.toggle-switch .switch-text {
font-size: 16px;
    vertical-align: middle;
    font-weight: bold;
cursor: pointer;	
	
}
.toggle-switch .switch-box {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 24px;
  vertical-align: middle;
}

.toggle-switch .switch-box input {display:none;}

.toggle-switch .switch {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .1s;
  transition: .1s;
  border-radius: 24px;
}

.toggle-switch .switch:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .1s;
  transition: .1s;
  border-radius: 50%;
}

.toggle-switch input:checked + .switch {
  background-color: #151515;
}

.toggle-switch  input:focus + .switch {
  box-shadow: 0 0 1px #151515;
}

.toggle-switch input:checked + .switch:before {
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  transform: translateX(16px);
}

@media only screen and (max-width:768px) {
.toggle-switch .switch-text, .toggle-switch .switch {
	cursor: default;
}	
}

.smb {
	font-weight: bold;
	font-size: 20px;
	padding: 4px 0px;
}
.smb [data-link], .smb [data-txt] {
	display: inline-block;
	    vertical-align: middle;
}
.smb [data-link] {
	    text-decoration: none;
    border-radius: 2px;
    background-color: #fff;
    border: none;
    box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 1px 0 1px #dadada, 0px 0px 0 1px #dadada;
    width: 40px;
    height: 40px;
    position: relative;
}
.smb[data-round] [data-link] {
	border-radius: 50%;
}
.smb [data-link]:hover {
	background-color: #f7f7f7;
}
.smb [data-link] img {
vertical-align: middle;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0;
    right: 0;
}

.textarea {
	width:100%;
	height: 80px;
resize:none;
    overflow:auto; 
    margin: 0;
    border-radius: 0.02em;
	padding: 4px 8px;
    background: #fff;
    color: #545454;
	font-size: inherit;
	border: none;
	box-shadow: 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 0px 0 1px #dadada;
}
.textarea:focus {
outline: none;
box-shadow: 0px 0px 0 1px #B5B4B4;
    -webkit-box-shadow: 0px 0px 0 1px #B5B4B4;
    -moz-box-shadow: 0px 0px 0 1px #B5B4B4;
}

[class^=notification-container-] {
	 position: fixed;
    width: 300px;
    margin: auto;
    top: 1%;
    left: 1%;
	z-index: 9999;
	
}
@media only screen and (max-width: 310px) {
    [class^=notification-container-] {
    width: 90%;	
}
}
[class^=notification-container-] .notification {
    padding: 16px;
    border-radius: 4px;
    background-color: #161616;
    color: #fff;
	margin-bottom: 4px;	
}
..notification:last-child {
	margin-bottom: 0px;
}

.notification-container-top-right {
    left: auto;
	right: 1%;
}

.notification-container-top{
    left: 0;
	right: 0;
}

.notification-container-bottom {
    left: 0;
	right: 0;
	top: auto;
	bottom: 1%;
}

.notification-container-bottom-right{
    left: auto;
	right: 1%;
	top: auto;
	bottom: 1%;
}

.notification-container-bottom-left{
    left: 1%;
	right: auto;
	top: auto;
	bottom: 1%;
}

.notification-container-top-right{
    left: auto;
	right: 1%;
	top: 1%;
	bottom: auto;
}

.pre-circle {
display: inline-block;
border-radius: 50%;
border-style:solid;
	border-bottom-color: transparent !important;
	-o-animation: precircle 900ms infinite linear;
-webkit-animation: precircle 900ms infinite linear;
    animation: precircle 900ms infinite linear;
	width: 20px;
	height: 20px;
	border-width:2px; 
}
/* loader color */
.pre-circle {
	border-color: #545454; 
}


@-webkit-keyframes precircle {
  0% { -webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg); }
  100% {  -webkit-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg); }
}

@keyframes precircle {
    0% { -webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg); }
  100% {  -webkit-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg); }
}

.preload-linear {
display: block;
overflow: hidden;
width: 100%;
}
.preload-linear .preload-main {
 background: #dadada;
 max-width: 100%;
     height: inherit;
	     vertical-align: middle;
		 height: 4px;
}
.preload-linear .preload-position {
    width: 0%;
    height: inherit;
    background: #545454;
    color: #fff;
    max-width: 100%;
	-o-animation: preloadlinear 900ms infinite linear;
-webkit-animation: preloadlinear  900ms infinite linear;
    animation: preloadlinear  900ms infinite linear;
}

@-webkit-keyframes preloadlinear  {
from {margin-left: 0%; width: 0%;}
to {margin-left: 100%; width: 100%;}
   
}
@keyframes preloadlinear  {
 from {margin-left: 0%; width: 0%;}
to {margin-left: 100%; width: 100%;}
}

html.tooltip-open, body.tooltip-open {
position: initial;
}
[data-tooltip-content] {
z-index: 999;
 position: absolute;
	background-color: #151515;
	color: #fff;
padding: 4px 8px;
font-size: inherit;
border-radius: 0.15em;
   text-align: center;   
}
.tooltip-top, .tooltip-bottom {
transform:translate(-50%, 0);
-webkit-transform:translate(-50%, 0);
-moz-transform:translate(-50%, 0);
-o-transform:translate(-50%, 0);
}
.tooltip-right, .tooltip-left {
transform:translate(0, -50%);
-webkit-transform:translate(0, -50%);
-moz-transform:translate(0, -50%);
-o-transform: translate(0, -50%);
}
[data-tooltip-content]::after {
    content: "";
    position: absolute;
	border-style: solid;
}
.tooltip-top::after {
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-color: #545454 transparent transparent transparent;
}
.tooltip-right::after {
   top: 50%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-color: transparent #545454 transparent transparent;
}
.tooltip-left::after {
       top: 50%;
    left: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-color: transparent transparent transparent #545454;
}
.tooltip-bottom::after {
 bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-color: transparent transparent #545454 transparent;
}

.card {
    padding: 8px;
display: inline-block;
overflow: hidden;
border-radius: 0.12em;
font-size: inherit;
  position: relative;
  background-color: #fff;
       box-shadow: 0px 0px 0 1px #dadada;
    -webkit-box-shadow: 0px 0px 0 1px #dadada;
    -moz-box-shadow: 0px 0px 0 1px #dadada;
}

/* FULL LOADER */
.full_loader, .full_loader *, .full_loader *:before, .full_loader *:after {
 -webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
 box-sizing: border-box;
}

.full_loader {
	    position: fixed;
    z-index: 2147483647;
    background: rgba(255, 255, 255, 0.7);
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    outline: 0;
    overflow: auto;
	color: #545454;
}
.full_loader .full_loader_circle {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.full_loader .pre-circle {
	width: 60px;
	height: 60px;
	border-width:6px; 
	border-color: #545454; 
}
.full_loader .preload-linear {
	position: absolute;
	top: 0%;
}
.full_loader .preload-linear .preload-main {
		 height: 4px;
}
.full_loader .preload-linear .preload-position {
    background: #545454;
}
.full_loader .full_loader_text {
font-weight: bold;
color: inherit;
text-align: center;
}

.full_loader[data-dark] {
	 background: rgba(0, 0, 0, 0.7);
	 color: #fff;
}
.full_loader[data-dark] .pre-circle {
	 border-color: #fff;
}

.rating { 
 border: none;
    clear: both;
    font-size: 2em;
    color: #151515;
	    margin: auto;
		display: inline-block;
}
.rating > input { display: none; } 
.rating > label:before { 
  margin: 5px;
  font-size: inherit;
  display: inline-block;
  content: "\2605";
}
.rating.rating-filled > label[data-value='1']:before {
	content: "\2605";
}
.rating.rating-filled > label[data-value='2']:before {
	content: "\2605 \2605";
}
.rating.rating-filled > label[data-value='3']:before {
	content: "\2605 \2605 \2605";
}
.rating.rating-filled > label[data-value='4']:before {
	content: "\2605 \2605 \2605 \2605";
}
.rating.rating-filled > label[data-value='5']:before {
	content: "\2605 \2605 \2605 \2605 \2605";
}
.rating > label { 
  color: #ddd; 
 float: right; 
}
.rating.rating-filled > label { 
 float: none; 
}
.rating > input:checked ~ label,
.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label, .rating-filled label { color: inherit;  }

.rating > input:checked + label:hover,
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label,
.rating > input:checked ~ label:hover ~ label { opacity: 0.5;  }

.collapse-text {
    display: inline-block;
	position: relative;
}

.collapse-text .collapse-text-ps {
	max-height: 120px;
    overflow: hidden;
}

.collapse-text .collapse-text-more {
    font-weight: bold;
    cursor: pointer;
    display: block;
    width: 100%;
		box-shadow: 0 -5px 15px 14px #fff;
	-webkit-box-shadow: 0 -5px 15px 14px #fff;
	-moz-box-shadow: 0 -5px 15px 14px #fff;
	
}
.collapse-text label {
    position: absolute;
    top: 100%;
}
.collapse-text input {
    display: none;
}
.collapse-text label:after {
       content: "SHOW MORE \2193";
    text-align: right;
    display: block;
	text-align: center;
}
.collapse-text input:checked + label:after {
    content: "SHOW LESS \2191";
}
.collapse-text input:checked ~ .collapse-text-ps {
    max-height: none !important;
}
.collapse-text input:checked + label {
   	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}

.range-input {
	border: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
   height: 8px;
    background: #e0e0e0;
	outline: none;
	    border-radius: 1.25em;
}
.range-input::-moz-focus-outer { border: 0; }
.range-input::-webkit-slider-thumb{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  /* THEME COLOR */
  background: #6b0ae4;
  cursor: pointer; 
}
.range-input::-moz-range-thumb {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  /* THEME COLOR */
  background: #6b0ae4;
  cursor: pointer; 
}

.hr-text {
position: relative;
box-sizing: content-box;
    height: 0;
    overflow: visible;
    margin: 20px 0 20px 0;
    border: 0;
    border-top: 1px solid #dadada;
	text-align: center;
}
.hr-text::after {
       content: attr(data-text);
    display: inline-block;
    position: absolute;
    top: -10px;
    padding: 0 1%;
    background-color: #fff;
    color: #dadada;
    font-size: medium;
    transform: translateX(-50%);
	-ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  
}



.badge {
    font-size: small;
    padding: 4px 8px;
    background-color: #151515;
    color: #fff;
    border-radius: 4px;
	font-weight: bold;
	display: inline-block;
	vertical-align: middle;
	margin-right: 4px;
	margin-bottom: 4px;
}
.badge:last-child {
	margin-right: 0px;
}

.badge.badge-theme {
    background-color: #6b0ae4; /* THEME COLOR */
}

.sk-load {
	position: relative;
	overflow: hidden;
	background-color: #e0e0e0;
}
.sk-load:after {
	content:'';
     top: 0;
    left: 0;
    right: 0;
    border: 0;
	transform:translateX(70%);
	width:100%;
	height:100%;
	position: absolute;
	z-index:1;
	animation-duration: inherit;
	-moz-animation-name: inherit;
	-webkit-animation-name: inherit;
	-o-animation-name: inherit;
	animation-name: skslide;
	-moz-animation-name: skslide;
	-webkit-animation-name: skslide;
	-o-animation-name: skslide;
animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	-o-animation-iteration-count: infinite;

background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 99%, rgba(255,255,255,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.8)), color-stop(99%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* IE10+ */
	background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 99%,rgba(255,255,255,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 ); 
}

.sk-load.sk-load-grey-shine:after {
background: -moz-linear-gradient(left, rgba(241, 241, 241,0) 0%, rgba(241, 241, 241,0.8) 50%, rgba(241, 241, 241,0) 99%, rgba(241, 241, 241,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(241, 241, 241,0)), color-stop(50%,rgba(241, 241, 241,0.8)), color-stop(99%,rgba(241, 241, 241,0)), color-stop(100%,rgba(241, 241, 241,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, rgba(241, 241, 241,0) 0%,rgba(241, 241, 241,0.8) 50%,rgba(241, 241, 241,0) 99%,rgba(241, 241, 241,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, rgba(241, 241, 241,0) 0%,rgba(241, 241, 241,0.8) 50%,rgba(241, 241, 241,0) 99%,rgba(241, 241, 241,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, rgba(241, 241, 241,0) 0%,rgba(241, 241, 241,0.8) 50%,rgba(241, 241, 241,0) 99%,rgba(241, 241, 241,0) 100%); /* IE10+ */
	background: linear-gradient(to right, rgba(241, 241, 241,0) 0%,rgba(241, 241, 241,0.8) 50%,rgba(241, 241, 241,0) 99%,rgba(241, 241, 241,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 ); 	
}

@keyframes skslide {
	0% {
	transform:translateX(-70%);
	-moz-transform: translateX(-70%);
	-webkit-transform: translateX(-70%);
	-o-transform: translateX(-70%);
	}
	100% {
	transform:translateX(70%);
	-moz-transform: translateX(70%);
	-webkit-transform: translateX(70%);
	-o-transform: translateX(70%);
	}
}

/* RESPONSIVE DEFAULT */
@media only screen and (max-width:1050px) {
.header-inner, .footer-inner, .navigation-inner {
width: 100%;
padding-left: 10px;
	padding-right: 10px;
}
.doc-header {
    width: 100%;
    border-bottom: 1px solid #eaeaea;
	padding-left: 10px;
	padding-right: 10px;
}
.doc-main  {
    width: 100%;
	border-right: none;
	border-left: none;
}
}
@media only screen and (max-width:768px) {
.header-inner, .footer-inner, .navigation-inner {
  width: 100%;
	  white-space: nowrap;
}
}

/* MY STYLESHEET */
a {
color: #6b0ae4;
font-weight: bold;
}
.button-normal {
	padding: 0 24px; line-height: 32px;height: 32px;
}
.button-normal:hover, .button-normal:focus {
	text-decoration: none;
}
.select-normal {
    padding: 4px;
}
.modal.modal-normal {
	background: rgba(255, 255, 255, 0.7);
}
.modal.modal-normal .modal-content {
	width: 500px;
	z-index: 9999;
	max-height: 500px;
	overflow: auto;
	border-radius: 2px;
}

@media only screen and (max-width:520px) {
	.modal.modal-normal .modal-content {
	width: 90%;
}
}
@media only screen and (max-height:520px) {
	.modal.modal-normal .modal-content {
	height: 90%;
}
}
.header-link svg {
	vertical-align: middle;
}
.footer-inner {
	 padding: 16px 0;
	text-align: center;
}
ul.footer-link-list {
	 list-style-type: none;
    padding: 0;
    margin: 0;
}
.footer-link-heading {
	margin-top: 0;
}
@media only screen and (max-width:768px) {
.header-link, .navigation-link {
display: none;	
}
.header-link.mobile-link, .navigation-link.mobile-link {
display: inline-block;	
}
.header-link.mobile-only, .navigation-link.mobile-only {
display: inline-block;	
}
.grid.footer-grid  .grid-row [class^=grid-col-] {
width: 100%;
text-align: center;
margin-bottom: 16px;
}
.grid.footer-grid  .grid-row [class^=grid-col-]:last-child {
margin-bottom: 0px;
}
}
.doc-header, .doc-navigation {
    text-align: center;
}
.doc-header .search {
    width: 440px;
    vertical-align: middle;
	font-size: small;
}
.center-content {
	position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    width: 370px;
    text-align: center;
}
.container {
	    padding: 16px;
}
.label-normal {
	    font-weight: bold;
    padding: 8px 0px;
    display: block;
}
.form-normal {
	width: 500px;
	margin: auto;
}
@media only screen and (max-width:520px) {
.form-normal {
	width: auto;
	margin: auto;
}	
}
[data-tooltip-content] {
    font-size: small;
}
.card.family-card {
	margin-right: 12px;
    margin-bottom: 12px;
    width: 460px;
    height: 270px;
    position: relative;
    overflow: hidden;
    padding: 0;
}

.family-card-heading:hover, .family-card-heading:focus {
	text-decoration: none;
	
}

.card.family-card .family-card-heading {
	font-size: 20px;
	color: #151515;
	font-weight: bold;
	margin: 0px 16px;
	word-break: break-all;
    overflow: hidden;
	text-align: left;
	display: block;
}
.card.family-card .family-card-meta {
	font-size: small;
	margin: 0px 16px;
    overflow: hidden;
	text-align: left;
	    margin-bottom: 8px;
}
.card.family-card .family-card-meta .rating.rating-filled {
	font-size: small;
	color: #6b0ae4;
	font-weight: bold;
}
@media only screen and (max-width: 1050px) {
.card.family-card {
	width: 48%;
	height: 250px;
}
}
@media only screen and (max-width: 800px) {
.card.family-card {
	width: 45%;
	height: auto;
}
}
@media only screen and (max-width: 680px) {
.card.family-card {
	width: 100%;
	height: auto;
}
}

.card.small-card {
	text-align: center;
	margin-right: 12px;
	margin-bottom: 12px;
	width: 200px;
	height: 100px;
	position: relative;
	overflow: hidden;
}
.card.small-card .small-card-content {
	 
	    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
	padding: 4px;
	font-size: normal;
    transform: translateY(-50%);
	 -webkit-transform: translateY(-50%);
	  -moz-transform: translateY(-50%);
	   -o-transform: translateY(-50%);
}
.card.small-card:hover,  .card.small-card:focus{
	text-decoration: none;
	opacity: 0.6;
}

.link-icon img, .link-icon span {
    vertical-align: middle;
}
.doc-navigation.cat-navigation  {
text-align: center;
}
.doc-navigation.cat-navigation .navigation-link {
	margin-right: 24px;
	text-decoration: none;
color: #5f5f5f;
font-size:small;
}
.doc-navigation.cat-navigation .navigation-link:hover {
	opacity: 0.6;
}
.doc-navigation.cat-navigation .navigation-link:last-child {
	margin-right: 0px;
}
.search-drop {
	     position: absolute;
    width: 440px;
    left: 763px;
    background-color: #fff;
    display: block;
    z-index: 999;
    top: 46px;
    border: 1px solid #ececec;
    border-top: none;
    overflow-y: auto;
    overflow-x: hidden;
	height:auto;
    max-height: 500px;
	transition: left 50ms;
}


@media only screen and (max-width:768px) {
.doc-header .search, .search-drop {
	width: 300px;
}
.search-drop {
	    max-height: 600px;
}
}

.search-drop .search-drop-item{
padding: 12px;
display: block;
text-decoration:none;
color:#262626;
border-bottom: 1px solid #f1f1f1;
font-weight: normal;
}
.search-drop .search-drop-item:last-child{
	border-bottom: none;
}
.search-drop-item:hover,  .search-drop-item:focus{
	background-color: #f9f9f9;
}
.search-drop-item img, .search-drop-item span{
	vertical-align: middle;
}
.card.card-wide {
margin-bottom: 12px;
position: relative;
overflow: hidden;
padding: 0;
width: 100%;
height: auto;
padding: 8px;	
text-align: left;
padding: 18px;
font-size: large;
text-decoration: none;
}

.rating-container {
	 display: inline-block; 
    text-align: center;
}
.rating-container .rating-heading {
display: inline-block;
}
.rating-container .rating-average {
	    font-size: 2em;
    font-weight: bold;
}
.rating-container .pre-circle {
	width: 24px;
	height: 24px;
	border-width:2.4px;
}
.rating[data-rated] {
	font-size: medium;
}
.rating-average .rating-filled {
	font-size: 1.1em;
	display: inline-block;
	
}
.tabs.family-tabs {
display: block;
margin-bottom: 16px;
font-weight: bold;
}
.tabs.family-tabs .tabs-item-active {

    border-bottom: 2px solid #6b0be4;
}
.light-hr {
	border-top-color: #ececec;
}
.font-style-list .font-style-list-item-load.sk-load, .font-style-list .font-style-list-item-click {
	width:100%;
	height:72px;
	border-radius:4px;
	animation-duration:1s;
	background-color: #f5f5f5;
	display: none;
}
.font-live-list-load.sk-load, .font-char-load.sk-load{
	width:100%;
	height:128px;
	border-radius:4px;
	animation-duration:1s;
	background-color: #f5f5f5;
}
.font-style-list .font-style-list-item-text, .font-char-list .font-char-list-item {
	display: none;
	font-size: 42px;
}
.font-char-list .font-char-list-item{
	line-height: 72px;
    letter-spacing: 24px;
}
.font-style-list {
	margin-top: 32px;
}
.font-style-list .font-style-list-item-click {
position: relative;
}

.font-style-list .font-style-list-item-click .button{
	    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 50%;
    right: 0;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	font-size: small;
}
.font-live-list .font-live-list-item {
	display: none;
}
.family-about-table th, .family-about-table td{
    box-shadow: none;
}
.family-about-table td {
	white-space: normal;
}
[data-font-ads] {
	display: inline;
}
.text-icon img, .text-icon span {
    vertical-align: middle;
}