/* File data: default.css */


html{width:100%; height:100%; margin:0; padding:0;}
*{margin:0; padding:0; -webkit-tap-highlight-color: transparent; box-sizing: border-box;}
table{border-collapse:collapse; border-spacing:0;}
fieldset, img{border:0;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
input,textarea,select{font-family: inherit; font-size: inherit; font-weight: inherit;}
input,textarea,select{*font-size: 100%;}
input[type="submit"]{-webkit-appearance: none}
select{background: #fff!important}
a, img{outline:0}
label{cursor:pointer;}
li{list-style:none}
ol, ul {padding:5px 0;}
ol li {list-style:decimal; list-style-position: inside; margin-bottom:12px;}
ul li {list-style:disc; list-style: inside; margin-bottom:12px;}

.block{display:block;}	
.inline{display:inline;}
.clear{clear:both; line-height:0 !important; font-size:0 !important; height:0 !important;}
.hidden{display:none;}
.left{float:left;}
.right{float:right;}

.editable p{padding:3px 0}
.editable ol, .editable ul{padding:7px 0 7px 15px}
.editable li{padding:3px 0}
.editable ol li{list-style:decimal; list-style-position:outside; margin-bottom:10px;}
.editable ul li{list-style:disc; list-style-position:inside;}
.editable td{padding:5px 10px}
.editable h1, .editable h2, .editable h3, .editable h4, .editable h5, .editable h6{padding:7px 0}
.editable h1{font-size:27px; line-height:29px;}
.editable h2{font-size:24px; line-height:26px;}
.editable h3{font-size:22px; line-height:24px;}
.editable h4{font-size:18px; line-height:20px;}
.editable h5{font-size:16px; line-height:18px;}
.editable h6{font-size:14px; line-height:16px;}

:root {
  --text-color: #212c40;
  --light-text-color: #9197a4;
  --contrast-color: #30bced;
  --higlight-color: #2eb4e3;
  --button-color: #151d2e;
  --button-hover-color: #303746;
  --light-background: #fdffce;
}

@font-face {
  font-family: 'Rubik';
  src: url('/media/css/../fonts/Rubik-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'RubikMedium';
  src: url('/media/css/../fonts/Rubik-Medium.ttf') format('truetype');
  font-style: normal;
}

@font-face {
  font-family: 'RubikSemiBold';
  src: url('/media/css/../fonts/Rubik-SemiBold.ttf') format('truetype');
  font-style: normal;
}

@font-face {
  font-family: 'RubikBold';
  src: url('/media/css/../fonts/Rubik-Bold.ttf') format('truetype');
  font-style: normal;
}
/* End of file */


/* File data: style.css */


html{height:100%; background: #fafaf6 url("/media/css/../images/back.png") top right no-repeat;
background-size: 69.5%;}
body{height:100%; min-width: 360px; position:relative; color:#212c40; font: 18px/24px "Rubik";
background: url("/media/css/../images/back-left.png") top 180px left no-repeat;}

h1{font:40px/45px "RubikMedium"; margin-bottom: 25px; position: relative}
h2, div.form-header{font: 30px/36px "RubikMedium"; margin-bottom: 10px; padding:10px 0 0 0; 
position:relative; max-width: 860px}
h3{font: 24px/36px "RubikMedium"; padding:10px 0 15px 0;}
h3 span{cursor: pointer;}
a{text-decoration:none; color: var(--higlight-color);}

.button{font: 16px "RubikMedium"; border-radius: 6px; background-color: var(--button-color); border: none; 
cursor: pointer; color: var(--contrast-color); transition: all 0.7s ease; border-radius: 6px; outline: none;}
.button:hover{background: var(--button-hover-color); color: var(--higlight-color);}

div.documentation{margin-bottom: 16px; font-family: 'RubikMedium';}
span.dots{background: url(/media/css/../images/dots.gif) no-repeat left center; padding-left:14px; display:block; color:#ff4343;}

#container{min-height:100%; position:relative; overflow: hidden}
#sticky-footer-wrapper{padding: 0 10px 190px 10px; margin:0 auto; max-width:1400px;}
#footer{height:190px; background: url("/media/css/../images/bottom-back.png") bottom left no-repeat; z-index: 5;
position: absolute; left: 0; bottom: 0; width: 100%;}

#header{position:relative; padding:40px 0 0 0; display: flex; margin-bottom: 75px;}
a.logo{width:90px; margin: 0 30px 0 0;}
a.logo img{display:block; width: 100%;}
#header-right-side{ width:calc(100% - 242px);}
.top-menu-button{width: 30px; height: 30px; background: url("/media/css/../images/menu.svg") no-repeat; flex-shrink: 0;
background-size: contain; margin: 6px 4% 0 0; cursor: pointer; display: none}
.documentation-menu-button{cursor: pointer; position: relative; height: 50px; display: none; width: 160px;
color: #fff; margin: 3px 4% 0 0; text-align: center;}

#demo-top{width:100px; height:100px; background: #7DD888; float:left;}
#demo-top a{color: #fff; display:block; padding:37px 0 45px 0; text-decoration:none; text-align:center;
font-size:14px; font-weight:bold;}

#search{float: right; width: 300px; position: relative; top: -3px;}
#search #search-field{width: 450px; padding: 12px 42px 11px 8px; width: 100%; border: none; font-size: 16px;
border-radius: 6px;}
#search #search-button{height: 35px; width: 35px; background: url("/media/css/../images/search.svg") no-repeat center;
border: none; position: absolute; right: 5px; top: 4px; cursor: pointer;}

#top-menu{float:left; padding:6px 0 0 0; width:690px; height: 38px;}
#top-menu > li{float:left; list-style:none; margin: 0 20px 0 0; position: relative; height: 100%}
#top-menu li a{font: 16px "RubikMedium"; color: #212c40; transition: all 0.3s ease;}
#top-menu li.active a, #top-menu > li:hover > a{color: var(--higlight-color)}
#top-menu li.submenu > a{background: url(/media/css/../images/menu-closed.svg) no-repeat right center; padding-right:12px;}
#top-menu li ul{position: absolute; border-radius: 15px; z-index: 10; top: 29px; left: -30px; 
padding: 20px 30px 14px 30px; background: #c3ceda; width: 190px; display: none;}
#top-menu > li:hover ul{display: block;}
#top-menu li ul li{float: none; margin: 0 0 12px 0; list-style: none; line-height: 18px;}
#top-menu li ul li a{font: 16px/10px "Rubik"}
#top-menu li ul li a:hover{color: #4ca0c5;}

#header div.socials{display: flex; gap: 20px; margin: 0 20px;}
#header div.socials a{width: 40px; height: 40px;}
#header div.socials a.github{background: url(/media/css/../images/social-github.svg) no-repeat center;
background-size: contain;}
#header div.socials a.twitter{background: url(/media/css/../images/social-twitter.svg) no-repeat center;
background-size: contain;}

.mobile-menu{width: 280px; height: 100%; overflow: auto; z-index: 1000; position: fixed; top: 0; overflow-y: auto;
background: #212c40; padding: 35px 20px 15px 30px; box-sizing: border-box; left: 0;}
.mobile-top-menu{display: none;}
.mobile-top-menu.open{right: 0}
.mobile-top-menu li{list-style: none; margin-bottom: 15px}
.mobile-top-menu ul ul li{margin-bottom: 7px;}
.mobile-menu a{color: #d9e5ee !important;}
.mobile-top-menu li.submenu > a{background: url(/media/css/../images/menu-closed.svg) no-repeat right center; padding-right:15px;}
.mobile-top-menu li ul{padding: 10px 0 0 15px; display: none;}

.mobile-documentation-menu{display: none;}
.mobile-documentation-menu.open{left: 0}
.mobile-documentation-menu div.section{padding: 8px 0; color: var(--higlight-color);}
.mobile-documentation-menu ul.left-menu{padding: 5px 0 0 15px;}
.mobile-documentation-menu ul.left-menu li{margin-bottom: 3px}
.menu-close{width: 20px; height: 20px; position: absolute; top: 10px; right: 10px; cursor: pointer;
background: url("/media/css/../images/close.svg")no-repeat; background-size: contain}

div.download{width:200px; height:50px; right:0; z-index:10; top: -7px; position: relative; display: flex;
flex-direction: column; gap: 2px; align-items: center; justify-content: center;}
div.download span{text-align:center; cursor:pointer; display:block;}
div.download span.add{font-size: 16px;}
div.download span.version{font: 12px "Rubik"; line-height: 13px;}

div.socseti{width:40px; height:40px; position:absolute; bottom:0px; right:110px}
div.socseti a{display:block; outline:none}
div.socseti a img{display:block;}

div.online-demo{width:99px; height:99px; position:absolute; top:-18px; background: url(/media/css/../images/demo-bg.png) no-repeat; z-index:5;}
div.online-demo a{display:block; width:99px; height:99px; text-decoration:none; text-align:center;}
div.online-demo a span{display:block; width:56px;font:bold 13px "Rubik"; color:#fff;}
div.online-demo a span.title{padding:27px 0 0 21px;}
div.online-demo a span.go{padding:0 0 0 21px; text-decoration:underline; font: 13px "Rubik"; color:#fcdad1;}
div.online-demo a:hover span.go{text-decoration:none;}

#left-side{min-height:400px; width:300px; position:relative; float:left;}
span.dots a{color: var(--higlight-color) text-decoration:none;}
#left-side-inside div.section{margin:0 0 12px 0; font: 16px "Rubik"; color: var(--higlight-color)}
#left-side-inside div.section span, .mobile-documentation-menu div.section span{cursor: pointer;
background: url(/media/css/../images/menu-closed.svg) no-repeat right center; padding-right:13px;}
#left-side-inside div.section.opened span, .mobile-documentation-menu div.section.opened span{
background: url(/media/css/../images/menu-opened.svg) no-repeat right center; padding-right:13px;}

ul.left-menu{margin:-10px 0 14px 0; padding: 0; display:none;}
ul.left-menu.opened{display:block;}
ul.left-menu.hidden{display: none;}
ul.left-menu li{margin-bottom: 0; list-style:none;}
ul.left-menu li a{color:#212c40; padding:0; text-decoration: none; font: 16px/26px "Rubik";
transition: all 0.3s ease;}
ul.left-menu li a:hover{color: var(--higlight-color)}
ul.left-menu li span.active a{var(--higlight-color); text-decoration:none;}
ul.left-menu ul{padding:3px 0 4px 15px;}
ul.left-menu li ul li{font-size:12px;}
ul.left-menu ul li.active{color:var(--higlight-color);}
ul.left-menu ul li.active a{background:none; color:var(--higlight-color); text-decoration:none;}

#content{min-height:400px; position:relative; width:calc(100% - 300px); float:left;}
#content-inside{padding-left:20px; padding-bottom:20px; border-radius: 6px;}
#content-inside.text{background: #fff; padding: 35px 4%;}
#content-inside p{margin-bottom:12px; max-width: 90%;}
#content-inside p img{max-width: 100%}
#content-inside ol, #content-inside li{margin-left: 18px;}
#content-inside li{margin-bottom: 12px; list-style-position: outside;}
#content-inside pre{margin-bottom:20px; overflow:auto; font-size: 17px; border-radius: 6px;}
#content-inside pre code{padding:20px 3%;}
#content-inside pre.basic{background: var(--text-color); color: var(--light-background);  padding:20px 2%;}
#content-inside div.hint{background:#c1f7c0; margin-bottom:20px; border-radius: 6px;
padding:20px 3%;}
#content-inside div.composer{padding:20px 3%; background: #333; color: #fff; margin-bottom:20px; border-radius: 6px;}

p.search-name{margin-bottom: 6px !important;}
p.search-name span.number{min-width: 25px; display: inline-block;}
p.search-decription{margin-left: 25px; margin-bottom: 16px !important;}
span.search-found{background: #ffed9f; padding: 0 2px;}

div.pager{margin-bottom:25px; margin-top:-5px}
div.pager span{margin-right: 12px;}
div.pager a{padding:3px 10px 2px 10px; margin: 0 2px 8px 0; border-radius:4px; display: inline-block;}
div.pager a.active, div.pager a:hover{background: var(--text-color); color:var(--higlight-color);}

.admin-gallery{display: grid; grid-template-columns: 1fr 1fr 1fr; max-width: 100%; gap: 10px;
margin-bottom: 20px;}
.admin-gallery > *{max-width: 100%;}
.admin-gallery img{display: block; max-width: 100%;}

#overlay{width: 100%; height: 100%; position: fixed; z-index: 100; background: #3c3b36; opacity: 0.6;
display: none; top: 0; left: 0;}

#footer-inside{padding-top:32px; max-width: 1400px; margin: 0 auto; padding: 90px 10px 0 10px;}
#footer p{margin-bottom:10px}
div.copyright{float:left;}
div.copyright a.english{margin-right: 20px;}
div.share{float:right; margin-right:30px; margin-top:-2px}

div.form-errors{background:#F8EDED; width:650px; padding:10px 0;}
div.form-errors p{color: #FF0000; margin:0 0 1px 40px !important}
div.success{background:#c1f7c0; color:#12643e; padding: 14px 20px; max-width: 900px;}
div.success.short{max-width: 500px;}

img.welcome{margin:10px 0;}

#wiki-bottom{width:100%; clear: both; padding:25px 0 0px 0; background: #fff; flex-wrap: wrap;
display: flex; justify-content: space-between;}
#wiki-bottom p{margin-bottom:0}
#wiki-bottom .previous-page{width:49%; float:left;}
#wiki-bottom .next-page{width:49%; float:right; text-align:right;}
#wiki-bottom .next-page p{max-width: 100%;}
#wiki-bottom a.banner{margin: 30px auto 0 auto;}
#wiki-bottom a.banner img{display: block; max-width: 100%;}

div.code-examples h3{padding-top: 15px;}
div.code-examples a{text-decoration: none;}
div.code-examples a:hover{text-decoration: underline;}

#index-content{padding: 20px 0 0 0; height: 718px;}
#index-content h1{font: 58px/68px "RubikBold"; color: #fff; margin-bottom: 35px;}
#index-content h2{font: 24px/30px "Rubik"; color: #fff; margin-bottom: 40px;}
#index-content h2 a{color: var(--higlight-color)}
#content-inside ul.features{margin-bottom: 20px;}
#content-inside ul.features li:last-child{margin-bottom: 0;}
#index-content .buttons{display: flex; gap: 3%; justify-content: center;}
#index-content .button{width: 170px; height: 60px; display: flex; align-items: center; justify-content: center;}
#index-content .button.github{background: #fff url(/media/css/../images/github.svg) left 27px center / 30px 30px no-repeat; 
border: 2px solid #151d2e; color: #151d2e; padding-left: 25px;}
#index-content .button.get{background-color: var(--contrast-color); color: #151d2e;}
#index-content .button.github:hover{background: #151d2e; color: var(--higlight-color); padding: 0;}
#index-content .button.examples{background: #212c40;}
#index-content .button.examples:hover{background: #313c50;}

ul.datatypes{margin: 0; padding: 0;}
ul.datatypes li{list-style: none; margin: 0 0 12px 0 !important;}

img.index-screenshot{margin-bottom: 25px; max-width: 930px; width: 100%; border-radius: 6px;}
div.index-texts pre{margin-bottom: 30px !important;}

a.mv-tracker-banner{position: absolute; right: 10px; top: 130px;}
a.mv-tracker-banner-left{display: block; margin-top: 15px;}
a.mv-tracker-banner-left img{display: block; max-width: 100%;}
a.mv-tracker-banner-bottom{display: none;}

/* Theme */
body{background: none;}
html{background: url(/media/css/../images/header.jpg) top center no-repeat;}
html:has(#index-content){background: url(/media/css/../images/illustration.png) top center no-repeat;}
#index-content{max-width: 750px; margin: 0 auto 60px auto;}
#index-content > *{text-align: center;}
#top-menu li a{color: #fff;}

#dynamic-smoke{position: absolute; z-index: 10; top: 220px; right: 210px; opacity: 0;}
#dynamic-comet{position: absolute; z-index: 10; top: -300px; left: 570px; opacity: 0;}
/* End of file */


/* File data: media.css */


@media screen and (max-width: 1500px)
{
    a.mv-tracker-banner{display: none;}
}

@media screen and (max-width: 1400px)
{
    #sticky-footer-wrapper{padding: 0 1.5% 190px 1.5%;}
}

@media screen and (max-width: 1060px)
{
    /* html{background-size: 150%; background-position: 180px -70px;} */
    html:has(#index-content){background-size: 1060px auto;}
    body{background: none;}

    #header{padding-top: 20px; height: auto; align-items: center; margin-bottom: 50px;
    justify-content: flex-end;}
    #header a.logo{margin-right: auto;}
    #header div.download{margin: 0 2%; top: auto;}
    #header .documentation-menu-button{margin: 0 2% 0 0; display: flex; justify-content: center;
    align-items: center;}
    #header a.github{margin: 0 3% 0 0;}
    #header .top-menu-button{display: block; margin: 0 3% 0 0;}

    #top-menu, #left-side, #search{display: none}
        
    #content{float: none; width: 100%}
    #content-inside{padding: 0 3% 20px 3%;}
    #content-inside p{max-width: 100%;}

    #index-content{height: 367px; margin-bottom: 45px;}
    #index-content h1{font-size: 48px; line-height: 50px; margin-bottom: 10px;}
    #index-content h2{font-size: 20px; line-height: 25px; margin-bottom: 30px;}

    a.mv-tracker-banner-bottom{display: block;}
    a.mv-tracker-banner-bottom img{display: block; max-width: 100%; margin: 0 auto;}
}

@media screen and (max-width: 730px)
{
    #index-content .buttons, #index-content h2{margin-left: 0;}
}

@media screen and (max-width: 710px)
{
    div.form-errors{width: 100%; padding-right: 5%;}
    #content form.ask, #content form.feedback{padding: 25px 5%; margin-bottom: 30px;}
    #content form .field-input .button{margin: 0 auto; display: block;}

    #header div.socials{display: none;}
}

@media screen and (max-width: 580px)
{
    #sticky-footer-wrapper{padding: 0 10px 190px 10px;}
    #header{padding-top: 10px; height: 55px; margin-bottom: 30px;}
    a.logo{width: 65px; margin-top: 5px; margin-right: 10px;}
    div.download{width: 75px;}
    .documentation-menu-button{font-size: 14px; line-height: 24px; margin-top: 0px;}
    .top-menu-button{margin-top: 3px;}
    div.download, #header .documentation-menu-button{padding: 5px 3%; width: auto; height: auto; 
    margin: 0 1% !important;}
    #header .documentation-menu-button{margin-right: 2.5% !important;}
    div.download span.add{padding: 0; font: 14px/24px "Rubik";}
    div.download span.version, #search{display: none;}
    #header a.github{width: 30px; height: 30px;}
    
    h1{font-size: 30px !important; line-height: 36px !important; margin-bottom: 15px !important;}
    h2, div.form-header{font: 18px/24px "RubikMedium" !important; padding: 0;}
    h3{font: 18px/24px "RubikMedium" !important}

    #index-content{padding-top: 10vw; height: 385px;}
    #index-content h1{font-size: 30px !important; margin: 0 5% 30px 5% !important;}
    #index-content h2{margin-bottom: 30px;}
    #index-content .buttons{justify-content: center; gap: 5%;}
    #index-content .button.get{display: none;}

    #content-inside.text{padding: 20px 5%;}
    #content-inside ul.features{margin-bottom: 5px;}
    form.feedback div.field-code{flex-direction: column; gap: 20px;}
}

@media screen and (max-width: 480px)
{
    body{font-size: 16px; line-height: 21px;}
    h1{line-height: 32px !important;}

    div.copyright, div.share{float: none; text-align: center}
    div.share{margin: 15px 0 0 0}
    
    #content-inside.text{padding: 20px 3%;}
    div.question{margin-bottom: 0;}
    .question div.question-inside, div.question.question-page{padding: 20px 5%}
    span.captcha{margin-left: 0!important; margin-bottom: 15px; display: block;}

    #content-inside pre{font-size: 15px !important;}
    #footer-inside{padding-top: 20px;}

    div.pager {padding: 10px 0 10px 5px; margin-bottom: 0}
    p.question-params span.reads{display: block; padding: 3px 0 0 0}
}
/* End of file */


/* File data: github-dark.min.css */

pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}
/* End of file */