diff --git a/src/Games/Flexcode/_config.yml b/src/Games/Flexcode/_config.yml new file mode 100644 index 00000000..18757c79 --- /dev/null +++ b/src/Games/Flexcode/_config.yml @@ -0,0 +1 @@ +include: [".nojekyll", "node_modules"] diff --git a/src/Games/Flexcode/css/style.css b/src/Games/Flexcode/css/style.css new file mode 100644 index 00000000..ddba246c --- /dev/null +++ b/src/Games/Flexcode/css/style.css @@ -0,0 +1,660 @@ +* { + box-sizing: border-box; +} + +html, body { + min-height: 100%; +} + +html[lang="fa"] #docs, +html[lang="fa"] #instructions, +html[lang="fa"] #credits .translate, +a[href="#fa"], +html[lang="he"] #docs, +html[lang="he"] #instructions, +html[lang="he"] #credits .translate, +a[href="#he"], +html[lang="ar"] #docs, +html[lang="ar"] #instructions, +html[lang="ar"] #credits .translate, +a[href="#ar"] { + direction: rtl; +} + +html[lang="fa"] #docs, +html[lang="fa"] #instructions, +html[lang="fa"] #credits .translate, +a[href="#fa"] { + font-family: Tahoma, Verdana, Segoe, sans-serif; +} + +body { + display: flex; + min-width: 600px; + margin: 0; + background-color: #43A047; + color: rgba(255, 255, 255, 0.8); + font-family: 'PT Sans', sans-serif; +} + +#sidebar { + width: 50%; + min-width: 300px; + position: relative; + padding: 2em; + background-color: #43A047; + font-size: 15px; +} + +.header { + display: flex; + flex-wrap: wrap; + margin-top: -0.5rem; + justify-content: space-between; +} + +.title { + margin: 0.5rem 0 0; + text-transform: uppercase; + font-family: 'Fredoka One', cursive; + font-size: 28px; +} + +pre { + margin: 0; +} + +code { + padding: 0 2px; + background-color: rgba(255, 255, 255, 0.2); + font-family: 'Source Code Pro', monospace; + font-weight: 900; + color: rgba(255, 255, 255, 0.8); + white-space: nowrap; +} + +li { + line-height: 1.5; +} + +a { + color: rgba(255, 255, 255, 0.7); +} + +a:hover { + color: #fff; +} + +.help { + cursor: pointer; + border-bottom: 1px solid rgba(255, 255, 255, 0.7); +} + +.tooltip { + position: absolute; + display: inline-block; + max-width: 350px; + padding: 1em 1em; + background-color: #2c3e50; + border-radius: 4px; + font-size: 12px; + line-height: 1.5; + z-index: 60; +} + +.tooltip:after { + content: ''; + position: absolute; + top: -12px; + left: 12px; + width: 0; + height: 0; + border-left: 12px solid transparent; + border-right: 12px solid transparent; + border-bottom: 12px solid #2c3e50; +} + +#instructions .tooltip code { + cursor: pointer; +} + +#share { + display: none; + margin-bottom: 3em; + text-align: center; +} + +.fb-like { + z-index: 20; + vertical-align: top; +} + +.games { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} + +.games a { + position: relative; + display: inline-block; + width: calc(50% - 0.25rem); + border-radius: 6px; + overflow: hidden; + text-decoration: none; + color: rgba(255, 255, 255, 0.9); +} + +.games a::before { + content: ""; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.3); + transition: background-color 0.2s; +} + +.games a:hover::before { + background-color: rgba(0, 0, 0, 0.1); +} + +.games a::after { + content: attr(data-title); + position: absolute; + left: 0; + right: 0; + bottom: 10%; + padding: 1rem; + background-color: rgba(0, 0, 0, 0.8); + font-family: 'Fredoka One', cursive; + font-size: 18px; +} + +.games a img { + width: 100%; + height: 100%; +} + +#instructions { + padding-top: 1rem; +} + +#instructions, +#instructions p, +#instructions ul { + /* helps prevent the difficulty animation from jumping */ + margin: 0; + padding-bottom: 1em; +} + +#editor { + position: relative; +} + +#editor, +pre { + font-family: 'Source Code Pro', monospace; + font-size: 16px; + line-height: 1.5; + color: #777; +} + +#css { + height: 260px; + position: relative; + padding: 10px 10px 10px 40px; + background-color: #e0e0e0; + border-radius: 4px; + overflow: hidden; +} + +.line-numbers { + position: absolute; + top: 0; + left: 0; + height: 100%; + padding: 10px 6px; + text-align: right; + background-color: #999; + color: #D5D5D5; +} + +#code { + display: block; + width: calc(100% - 16px); + height: 24px; + margin-left: 16px; + border: none; + font-family: 'Source Code Pro', monospace; + font-size: 16px; + outline: none; + resize: none; + overflow: auto; +} + +#level-counter { + position: relative; + display: inline-block; + height: 30px; + margin-top: 0.5rem; + font-size: 15px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +#levelsWrapper { + display: none; + top: 30px; + right: 31px; + max-width: 160px; + padding: 1em 0.5em; + margin-top: 12px; + z-index: 80; +} + +#levelsWrapper:after { + left: calc(50% - 12px); +} + +#levels { + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +.level-marker { + float: left; + display: inline-block; + width: 30px; + height: 30px; + margin: 2px; + line-height: 26px; + background-color: rgba(255, 255, 255, 0.2); + border: 2px solid transparent; + border-radius: 50%; + text-align: center; + cursor: pointer; +} + +.level-marker.current, +.level-marker:hover { + border-color: rgba(255, 255, 255, 0.5); +} + +.level-marker.solved { + background-color: #228B24; +} + +#level-indicator, +.arrow { + float: left; + height: 30px; + background-color: rgba(255, 255, 255, 0.2); +} + +#level-indicator { + display: inline-block; + width: 160px; + line-height: 30px; + text-align: center; + cursor: pointer; +} + +#labelLevel { + margin-left: 5px; +} + +.caret { + display: inline-block; + margin-left: 2px; +} + +#level-indicator:hover, +.arrow:not(.disabled):hover { + background-color: rgba(255, 255, 255, 0.4); +} + +#labelReset { + margin-top: 1em; + text-align: center; + cursor: pointer; +} + +.arrow { + display: inline-flex; + align-items: center; + padding: 0.25em 0.5em 0.2em; + cursor: pointer; +} + +.arrow.left { + border-right: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 4px 0 0 4px; +} + +.arrow.right { + border-left: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 0 4px 4px 0; +} + +.arrow.left:not(.disabled):hover, +.arrow.right:not(.disabled):hover { + border-color: transparent; +} + +.arrow.disabled { + opacity: 0.5; +} + +.triangle { + display: inline-block; + width: 0; + height: 0; + border-top: 7px solid transparent; + border-bottom: 7px solid transparent; +} + +.left .triangle { + border-right: 11px solid rgba(255, 255, 255, 0.7);; +} + +.right .triangle { + border-left: 11px solid rgba(255, 255, 255, 0.7);; +} + +button { + display: inline-block; + padding: 0.4em 0.8em; + background-color: #D11606; + border: none; + border-radius: 4px; + font-family: 'PT Sans', sans-serif; + font-size: 16px; + line-height: 24px; + color: #fff; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-appearance: none; + appearance: none; +} + +button:active { + outline: none; +} + +button:not(.disabled):hover { + background-color: #F12D22; +} + +#next { + position: absolute; + right: 1em; + bottom: 1em; + padding-top: 0.3em; +} + +.animation { + animation: tada 1s, pulse 2s infinite 2s; +} + +#next.disabled { + opacity: 0.5; +} + +.credits { + margin-top: 1.5em; + line-height: 1.5em; + text-align: center; + font-size: 12px; + color: rgba(255, 255, 255, 0.6); +} + +#settings { + position: relative; +} + +.toggle { + display: inline-block; + padding: 1px 8px; + background-color: rgba(255, 255, 255, 0.2); + border-radius: 3px; + color: rgba(255, 255, 255, 0.7); + cursor: pointer; + user-select: none; +} + +#settings .tooltip { + display: none; + bottom: 30px; + left: 0px; + width: 275px; + max-width: 275px; + padding: 1em; + text-align: left; + z-index: 80; +} + +#settings .tooltip:after { + top: auto; + bottom: -12px; + border-left: 12px solid transparent; + border-right: 12px solid transparent; + border-top: 12px solid #2c3e50; + border-bottom: none; +} + +#settings section { + margin: 0.5rem 0; +} + +#settings h4 { + margin: 0; + color: rgba(255, 255, 255, 0.8); +} + +#board { + position: sticky; + top: 0; + width: 50vw; + height: 50vw; + min-width: 300px; + min-height: 300px; + max-width: 100vh; + max-height: 100vh; + overflow: hidden; +} + +#pond, +#background { + display: flex; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + padding: 1em; +} + +#background { + z-index: 10; + border-radius: 0 0 0 10px; + background-color: #1F5768; +} + +#pond { + z-index: 20; +} + +.lilypad, +.frog { + position: relative; + width: 20%; + height: 20%; + overflow: hidden; +} + +.frog.bounceOutUp { + -webkit-animation-delay: .6s; + -moz-animation-delay: .6s; + -ms-animation-delay: .6s; + animation-delay: .6s; +} + +.frog .bg.bounce { + -webkit-animation-duration: 2s; + -moz-animation-duration: 2s; + -ms-animation-duration: 2s; + animation-duration: 2s; +} + +.frog.yellow .bg.bounce { + -webkit-animation-delay: .3s; + -moz-animation-delay: .3s; + -ms-animation-delay: .3s; + animation-delay: .3s; +} + +.frog.red .bg.bounce { + -webkit-animation-delay: .6s; + -moz-animation-delay: .6s; + -ms-animation-delay: .6s; + animation-delay: .6s; +} + +.lilypad .bg, +.frog .bg { + width: 100%; + height: 100%; + background-position: center center; + background-size: contain; + background-repeat: no-repeat; +} + +.frog .bg { + background-size: 60% 60%; +} + +.lilypad.green .bg { + background-image: url("../images/lilypad-green.svg"); +} + +.lilypad.green.cb-friendly .bg { + background-image: url("../images/lilypad-green-color-assist.svg"); +} + +.lilypad.red .bg { + background-image: url("../images/lilypad-red.svg"); +} + +.lilypad.red.cb-friendly .bg { + background-image: url("../images/lilypad-red-color-assist.svg"); +} + +.lilypad.yellow .bg { + background-image: url("../images/lilypad-yellow.svg"); +} +.lilypad.yellow.cb-friendly .bg { + background-image: url("../images/lilypad-yellow-color-assist.svg"); +} + +.frog.green .bg { + background-image: url("../images/frog-green.svg"); +} + +.frog.green.cb-friendly .bg { + background-image: url("../images/frog-green-color-assist.svg"); +} + +.frog.red .bg { + background-image: url("../images/frog-red.svg"); +} + +.frog.red.cb-friendly .bg { + background-image: url("../images/frog-red-color-assist.svg"); +} + +.frog.yellow .bg { + background-image: url("../images/frog-yellow.svg"); +} + +.frog.yellow.cb-friendly .bg { + background-image: url("../images/frog-yellow-color-assist.svg"); +} + +.wrap { + flex-wrap: wrap; +} + +@media only screen and (max-width: 767px) { + body { + flex-direction: column-reverse; + align-items: center; + min-width: 100vw; + } + + body, + #sidebar { + font-size: 13px; + } + + #sidebar { + width: 100%; + } + + #background { + border-radius: 0 0 10px 10px; + } + + .header { + justify-content: center; + } + + .title { + font-size: 26px; + } + + #labelFooter { + display: none; + } +} + +/* Native by BuySellAds */ +.native-ad { + display: block; + padding: 10px 20px 8px; + border-radius: 4px; + background: repeating-linear-gradient(-45deg, transparent, transparent 5px, hsla(0, 0%, 0%, .03) 5px, hsla(0, 0%, 0%, .03) 10px) hsla(0, 0%, 0%, .03); + margin-top: 1.5em; + font-size: 12px; +} + +.native-ad a { + text-decoration: none; + display: block; + line-height: 1.5; +} + + +.native-ad .sponsor { + position: relative; + top: -1px; + padding: 3px 4px 2px; + margin-right: 4px; + border: solid 1px currentColor; + border-radius: 2px; + color: currentColor; + content: "Sponsor"; + text-transform: uppercase; + font-size: 11px; + letter-spacing: 1px; + font-weight: 600; + line-height: 1; +} + diff --git a/src/Games/Flexcode/favicon.ico b/src/Games/Flexcode/favicon.ico new file mode 100644 index 00000000..2428c868 Binary files /dev/null and b/src/Games/Flexcode/favicon.ico differ diff --git a/src/Games/Flexcode/images/frog-green-color-assist.svg b/src/Games/Flexcode/images/frog-green-color-assist.svg new file mode 100644 index 00000000..17c92c00 --- /dev/null +++ b/src/Games/Flexcode/images/frog-green-color-assist.svg @@ -0,0 +1,25 @@ + + + + frog-green + Created with Sketch. + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/frog-green.svg b/src/Games/Flexcode/images/frog-green.svg new file mode 100644 index 00000000..587b1bcf --- /dev/null +++ b/src/Games/Flexcode/images/frog-green.svg @@ -0,0 +1,25 @@ + + + + frog-green + Created with Sketch. + + + + + + + + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/frog-red-color-assist.svg b/src/Games/Flexcode/images/frog-red-color-assist.svg new file mode 100644 index 00000000..8119efe6 --- /dev/null +++ b/src/Games/Flexcode/images/frog-red-color-assist.svg @@ -0,0 +1,58 @@ + + + + frog-red + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/frog-red.svg b/src/Games/Flexcode/images/frog-red.svg new file mode 100644 index 00000000..f4e8b49d --- /dev/null +++ b/src/Games/Flexcode/images/frog-red.svg @@ -0,0 +1,25 @@ + + + + frog-red + Created with Sketch. + + + + + + + + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/frog-yellow-color-assist.svg b/src/Games/Flexcode/images/frog-yellow-color-assist.svg new file mode 100644 index 00000000..0e708e53 --- /dev/null +++ b/src/Games/Flexcode/images/frog-yellow-color-assist.svg @@ -0,0 +1,68 @@ + + + + frog-yellow + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/frog-yellow.svg b/src/Games/Flexcode/images/frog-yellow.svg new file mode 100644 index 00000000..79ac9b06 --- /dev/null +++ b/src/Games/Flexcode/images/frog-yellow.svg @@ -0,0 +1,26 @@ + + + + frog-yellow + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/games/code-crunchers.png b/src/Games/Flexcode/images/games/code-crunchers.png new file mode 100644 index 00000000..fdeb70a1 Binary files /dev/null and b/src/Games/Flexcode/images/games/code-crunchers.png differ diff --git a/src/Games/Flexcode/images/games/disarray.png b/src/Games/Flexcode/images/games/disarray.png new file mode 100644 index 00000000..082ce353 Binary files /dev/null and b/src/Games/Flexcode/images/games/disarray.png differ diff --git a/src/Games/Flexcode/images/games/grid-garden.png b/src/Games/Flexcode/images/games/grid-garden.png new file mode 100644 index 00000000..01cee1a0 Binary files /dev/null and b/src/Games/Flexcode/images/games/grid-garden.png differ diff --git a/src/Games/Flexcode/images/games/nth-cart.png b/src/Games/Flexcode/images/games/nth-cart.png new file mode 100644 index 00000000..d13d0a02 Binary files /dev/null and b/src/Games/Flexcode/images/games/nth-cart.png differ diff --git a/src/Games/Flexcode/images/lilypad-green-color-assist.svg b/src/Games/Flexcode/images/lilypad-green-color-assist.svg new file mode 100644 index 00000000..9fa45d20 --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-green-color-assist.svg @@ -0,0 +1,18 @@ + + + + lilypad-green + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/lilypad-green.svg b/src/Games/Flexcode/images/lilypad-green.svg new file mode 100644 index 00000000..c48c849e --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-green.svg @@ -0,0 +1,18 @@ + + + + lilypad-green + Created with Sketch. + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/lilypad-red-color-assist.svg b/src/Games/Flexcode/images/lilypad-red-color-assist.svg new file mode 100644 index 00000000..2e417a11 --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-red-color-assist.svg @@ -0,0 +1,32 @@ + + + + lilypad-red + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/lilypad-red.svg b/src/Games/Flexcode/images/lilypad-red.svg new file mode 100644 index 00000000..6cec0abe --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-red.svg @@ -0,0 +1,18 @@ + + + + lilypad-red + Created with Sketch. + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/lilypad-yellow-color-assist.svg b/src/Games/Flexcode/images/lilypad-yellow-color-assist.svg new file mode 100644 index 00000000..b98838aa --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-yellow-color-assist.svg @@ -0,0 +1,29 @@ + + + + lilypad-yellow + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/images/lilypad-yellow.svg b/src/Games/Flexcode/images/lilypad-yellow.svg new file mode 100644 index 00000000..d985ef9f --- /dev/null +++ b/src/Games/Flexcode/images/lilypad-yellow.svg @@ -0,0 +1,18 @@ + + + + lilypad-yellow + Created with Sketch. + + + + + + + + + + + + + diff --git a/src/Games/Flexcode/images/screenshot.png b/src/Games/Flexcode/images/screenshot.png new file mode 100644 index 00000000..c5397edd Binary files /dev/null and b/src/Games/Flexcode/images/screenshot.png differ diff --git a/src/Games/Flexcode/index.html b/src/Games/Flexcode/index.html new file mode 100644 index 00000000..3db39fa7 --- /dev/null +++ b/src/Games/Flexcode/index.html @@ -0,0 +1,107 @@ + + + + + + Flexcode + + + + + + + + +
+
+
+
+
+
+
+
+ + + + + + + +
+ + + + + + + + \ No newline at end of file diff --git a/src/Games/Flexcode/js/docs.js b/src/Games/Flexcode/js/docs.js new file mode 100644 index 00000000..886d3ad8 --- /dev/null +++ b/src/Games/Flexcode/js/docs.js @@ -0,0 +1,378 @@ +var docs = { + 'align-content': { + 'en': '

Aligns a flex container\'s lines within the flex container when there is extra space on the cross-axis.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'he': '

יישור שורות בתוך ה-flex כשיש מקום מיותר בציר המשני.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ro': '

Aliniază liniile unui container flex cu containerul flex cand există spațiu în plus pe axa transversală.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'bg': '

Подравнява реводете на flex контейнера вътре в него ако има допълнително място по вртикалата.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'de': '

Richtet die Zeilen innerhalb eines flex-Containers aus, wenn auf der Querachse Platz ist.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'pt-br': '

Alinha as linhas dentro de um container flex quando há espaço sobrando no eixo cruzado.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'es': '

Alinea las líneas de un contenedor flex cuando exista más espacio en el eje transversal.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'fr': '

Aligne les lignes d\'un conteneur flex à l\'intérieur du conteneur flex quand il y a de l\'espace superflu sur l\'axe transversal.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ru': '

Выравнивает ряды flex-контейнера внутри него (работает только, если элементы расположены больше чем в один ряд).

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'fa': '

فرض کنید که ارتفاع flex-container بیشتر از فضایی است که flex-lineها گرفته اند و اصطلاحا مقداری فضای خالی در flex-container وجود دارد. به کمک خاصیت align-content شما می‌توانید محل قرارگیری این flex-line ها را مشخص کنید که از نظر محور عمودی در کجا قرار گیرند.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'zh-cn': '

当交叉轴有多余空间时，对齐容器内的轴线。

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'zh-tw': '

當交叉軸有多餘空間時，對齊容器內的軸線。

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'tr': '

Eğer cross-axis\'de fazladan alan varsa, flex container satırlarını flex container\'ın içinde hizalar.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'az': '

Əgər cross-axis\'də artıq sahə varsa, flex container sətirlərini flex container\'in içində nizamlayar.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'it': '

Allinea le linee all\'interno di un contenitore flex se c\'è spazio extra lungo l\'asse verticale

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ko': '

세로선 상에 여분의 공간이 있는 경우 Flex 컨테이너 사이의 간격을 조절합니다.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'lt': '

Lygiuoja elastiško supančio elemento eilutes, kai kertančios ašies atžvilgiu yra laisvos vietos.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'vi': '

Sắp xếp các dòng trong hộp chứa khi có thêm không gian dọc theo trục ngang.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'pl': '

Wyrównuje wiersze wewnątrz kontenera z atrybutem flex w przypadku gdy na osiach poprzecznych jest dodatkowe miejsce.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'cs': '

Určuje zarovnání řádků ve směru vedlejší osy, pokud je v kontejneru přebytek místa.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ja': '

直行軸 (cross axis) に余裕がある場合、コンテナー内の行を配置します。

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'hu': '

A flex konténer sorvonalait igazítja a flex konténeren belül, amennyiben van szabad tér a másodlagos kereszttengely mentén.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'eo': '

Vicigas la liniojn de la fleksujo tie kie estas aldona spaco sur la transversakso.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'sv': '

Justerar en flex-containers rader inom flex-containern när det finns extra utrymme på motsata axeln.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'uk': '

Вирівнює рядки flex-контейнеру всередені самого flex-контейнеру, коли є додатковий простір на поперечній осі.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'hi': '

यह कंटेनर के भीतर रखी वस्तुओं के मध्य की जगह को संरेखित करता है।

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'sr': '

Поравњава редове у флекс контејнеру када постоји вишак простора дуж попречне осе.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'bs': '

Poravnava redove u fleks kontejneru kada postoji višak prostora duž poprečne ose.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'hr': '

Poravnava redove u fleks kontejneru kada postoji višak prostora duž poprečne osi.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'nl': '

Lijnt de lijnen van een flex container binnen de flex container uit waneer er extra plaats is op de dwarsas.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ta': '

குறுக்கு அச்சு மீது கூடுதல் இடம் இருக்கும் போது flex container-ல் வரிகளை சீரமைக்கும்.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'te': '

క్రాస్-యాక్సిస్‌లో అదనపు స్థలం ఉన్నప్పుడు ఫ్లెక్స్ కంటైనర్‌లోని పంక్తులను సమలేఖనం చేస్తుంది.

flex-startflex-end center space-between space-around space-evenly stretch (default)', + 'ml': '

ക്രോസ്-അച്ചുതയിൽ അധിക സ്ഥലം ഉള്ളപ്പോൾ ഫ്ലെക്സസ് കണ്ടെയ്നറിലുള്ള നിരകൾ വിന്യസിക്കുന്നു.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'el': '

Ευθυγραμμίζει τις γραμμές ενός flex container μέσα στο πλαίσιο του flex container όταν υπάρχει επιπλέον χώρος στον εγκάρσιο άξονα.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'mk': '

Ги подредува линиите на flex контејнерот кога во него има дополнителнен простор по вертикалната оска.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'lv': '

Novieto flex-elementu robežas flex-konteinera iekšienē.(Darbojas tikai, ja ir pieejama papildus vieta uz šķērsojošās ass.)

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'id': '

Selaraskan garis flex di dalam wadah flex apabila ada ruang tambahan pada sumbu silang

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ar': '

محاذاة سطور حاويات فكلس في داخل حاوية فلكس عندما يكون هناك مساحة اضافية على المحور الثانوي .

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'ca': '

Alinea les línees d\'un contenidor flex quan existeixi més espai en l\'eix transversal.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'da': '

Justerer en flex-containers linjer inden i flex-containeren når der er plads til overs på den tværgående akse.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'et': '

Joondab flex konteineri jooned flex konteineriga kui on piisavalt ruumi ristteljel.

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'fi': '

Kohdistaa rivit flex-säilössä, jos poikittaisakselilla on ylimääräistä tilaa.

flex-start flex-end center space-between space-around space-evenly stretch (oletusarvo)', + 'gl': '

Aliña as liñas dun contedor flex cando hai espazo extra no eixe transversal.

flex-start flex-end center space-between space-around stretch', + 'th': '

จัดเรียงบรรทัดภายใน flex container ในกรณีที่มีพื้นที่ว่างบนแกนขวาง

flex-start flex-end center space-between space-around space-evenly stretch (default)', + 'mn': '

Хөндлөн тэнхлэгт нэмэлт зай байгаа үед flexbox-н мөрүүдийг дураараа байрлуулна.

flex-start flex-end center space-between space-around space-evenly stretch (default)' + }, + 'align-items': { + 'en': '

Aligns flex items along the cross axis.

flex-start flex-end center baseline stretch (default)', + 'he': '

יישור פריטים ב-flex לאורך הציר המשני.

flex-start flex-end center baseline stretch (default)', + 'ro': '

Aliniază elementele flex de-a lungul axei transversale.

flex-start flex-end center baseline stretch (default)', + 'bg': '

Подрежда flex елементите по дължината на осите.

flex-start flex-end center baseline stretch (default)', + 'de': '

Richtet die flex-Elemente entlang der Querachse aus.

flex-start flex-end center baseline stretch (default)', + 'pt-br': '

Alinha itens flex ao longo do eixo cruzado.

flex-start flex-end center baseline stretch (default)', + 'es': '

Alinea elementos Flex a lo largo del eje transversal.

flex-start flex-end center baseline stretch (default)', + 'fr': '

Aligne les éléments flex selon l\'axe transversal.

flex-start flex-end center baseline stretch (default)', + 'ru': '

Выравнивает flex-элементы вдоль пересекаемой оси.

flex-start flex-end center baseline stretch (default)', + 'fa': '

این خاصیت نحوه چینش Flex itemها را در محور Cross مشخص می کند. این خاصیت مانند justify-content است تنها تفاوت آنها در مقادیرشان است.

flex-start flex-end center baseline stretch (default)', + 'zh-cn': '

在交叉轴上对齐多个元素

flex-start flex-end center baseline stretch (default)', + 'zh-tw': '

在交叉軸上對齊多個元素

flex-start flex-end center baseline stretch (default)', + 'tr': '

Flex öğelerini cross-axis boyunca hizalar.

flex-start flex-end center baseline stretch (default)', + 'az': '

Flex elementlərini cross-axis boyunca nizamlayar.

flex-start flex-end center baseline stretch (default)', + 'it': '

Allinea gli elementi flex lungo l\'asse verticale

flex-start flex-end center baseline stretch (default)', + 'ko': '

Flex 요소를 세로선 상에서 정렬합니다.

flex-start flex-end center baseline stretch (default)', + 'lt': '

Lygiuoja elastiškus elementus palei kertančią ašį.

flex-start flex-end center baseline stretch (default)', + 'vi': '

Sắp xếp các hạng mục flex dọc theo trục ngang.

flex-start flex-end center baseline stretch (default)', + 'pl': '

Wyrównuje elementy z atrybutem flex wzdłuż osi poprzecznych.

flex-start flex-end center baseline stretch (default)', + 'cs': '

Určuje zarovnání všech prvků ve směru vedlejší osy.

flex-start flex-end center baseline stretch (default)', + 'ja': '

アイテムを直行軸 (cross axis) に沿って配置します。

flex-start flex-end center baseline stretch (default)', + 'hu': '

A másodlagos kereszt-tengely mentén igazítja a flex elemeket.

flex-start flex-end center baseline stretch (default)', + 'eo': '

Vicigas transversakse fleksajn erojn.

flex-start flex-end center baseline stretch (default)', + 'sv': '

Justerar flex-objekt längs med motsata axeln.

flex-start flex-end center baseline stretch (default)', + 'uk': '

Вирівнює flex-елементи вздовж перетинної осі.

flex-start flex-end center baseline stretch (default)', + 'hi': '

वस्तुओं को उर्ध्वाधर रूप से संरेखित करता है।

flex-start flex-end center baseline stretch (default)', + 'sr': '

Поравњава флекс елементе дуж попречне осе.

flex-start flex-end center baseline stretch (default)', + 'bs': '

Poravnava fleks elemente duž poprečne ose

flex-start flex-end center baseline stretch (default)', + 'hr': '

Poravnava fleks elemente duž poprečne osi

flex-start flex-end center baseline stretch (default)', + 'nl': '

Lijnt flex elementen uit over de dwarsas.

flex-start flex-end center baseline stretch (default)', + 'ta': '

குறுக்கு அச்சு வழியாக உருப்படிகளை ஒழுங்குபடுத்துகிறது.

flex-start flex-end center baseline stretch (default)', + 'te': '

క్రాస్ యాక్సిస్ వెంట ఫ్లెక్స్ అంశాలను సమలేఖనం చేస్తుంది.

flex-start flex-end center baseline stretch (default)', + 'ml': '

ക്രോസ്സ് അക്ഷത്തിൽ വളവുതിരിവുകളുള്ള ഇനങ്ങൾ വിന്യസിക്കുന്നു.

flex-start flex-end center baseline stretch (default)', + 'el': '

Ευθυγραμμίζει αντικείμενα flex κατά μήκος του εγκάρσιου άξονα.

flex-start flex-end center baseline stretch (default)', + 'mk': '

Ги подредува flex елементите по вертикалната оска.

flex-start flex-end center baseline stretch (default)', + 'lv': '

Novieto flex vienības attiecībā pret šķērsojošo asi.

flex-start flex-end center baseline stretch (default)', + 'id': '

Sejajarkan item fleksibel di sepanjang sumbu silang.

flex-start flex-end center baseline stretch (default)', + 'ar': '

محاذاة عناصر فلكس على طول المحور الثانوي.

flex-start flex-end center baseline stretch (default)', + 'ca': '

Alinea elements Flex al llarg de l\'eix transversal.

flex-start flex-end center baseline stretch (default)', + 'da': '

Justerer flex-elementer langs den tværgående akse.

flex-start flex-end center baseline stretch (default)', + 'et': '

Joondab flex elemendid mööda risttelge.

flex-start flex-end center baseline stretch (default)', + 'fi': '

Kohdistaa flex-elementit poikittaisakselin suuntaisesti.

flex-start flex-end center baseline stretch (oletusarvo)', + 'gl': '

Aliña os elementos flex no eixe transversal.

flex-start flex-end center baseline stretch', + 'th': '

จัดเรียง flex items ตามแกนขวาง

flex-start flex-end center baseline stretch (default)', + 'mn': '

Хөндлөн тэнхлэгийн дагуу flex items-г байрлуулна.

flex-start flex-end center baseline stretch (default)' + }, + 'align-self': { + 'en': '

Aligns a flex item along the cross axis, overriding the align-items value.

flex-start flex-end center baseline stretch', + 'he': '

יישור פריט flex ספציפי לאורך הציר המשני, דורס את ההגדרה של align-items.

flex-start flex-end center baseline stretch', + 'ro': '

Aliniază un element flex de-a lungul axei transversale, suprascriind valoarea proprietății align-items.

flex-start flex-end center baseline stretch', + 'bg': '

Подрежда flex елемент по дължината на осите, презаписвайки align-items стойността.

flex-start flex-end center baseline stretch', + 'de': '

Richtet die flex-Elemente entlang der Querachse aus und überschreibt den Wert von align-items.

flex-start flex-end center baseline stretch', + 'pt-br': '

Alinha um item flex ao longo do eixo cruzado, substituindo o valor de align-items.

flex-start flex-end center baseline stretch', + 'es': '

Alinea un elemento flex a lo largo del eje transversal, anulando el valor de align-items

flex-start flex-end center baseline stretch', + 'fr': '

Aligne un élément flex selon l\'axe transversal, outrepassant la valeur de align-items.

flex-start flex-end center baseline stretch', + 'ru': '

Выравнивает flex-элемент вдоль пересекаемой оси, перекрывая значения свойства align-items.

flex-start flex-end center baseline stretch', + 'fa': '

با استفاده از این خاصیت می‌توانید نحوه قرار گرفتن عمودی هر flex item را مشخص کنید. مقادیر این خاصیت دقیقا همان مقادیر خاصیت align-items است. align-items value.

flex-start flex-end center baseline stretch', + 'zh-cn': '

在交叉轴上对齐一个元素，覆盖align-items所设定的值.

flex-start flex-end center baseline stretch', + 'zh-tw': '

在交叉軸上對齊一個元素，覆蓋align-items所设定的值.

flex-start flex-end center baseline stretch', + 'tr': '

align-items\'ın değerini ezerek, sadece bu öğeyi cross-axis boyunca hizalar

flex-start flex-end center baseline stretch', + 'az': '

align-items\'ın dəyərini üstələyərək, sadəcə bu elementi cross-axis boyunca nizamlayar

flex-start flex-end center baseline stretch', + 'it': '

Allinea un elemento flex lungo l\'asse verticale, sovrascrive il valore di align-items.

flex-start flex-end center baseline stretch', + 'ko': '

지정된 align-items 값을 무시하고 Flex 요소를 세로선 상에서 정렬합니다.

flex-start flex-end center baseline stretch', + 'lt': '

Lygiuoja elastišką elementą palei kertančią ašį nepaisant align-items reikšmės.

flex-start flex-end center baseline stretch', + 'vi': '

Sắp xếp một hạng mục flex dọc theo trục ngang, ghi đè lên giá trị của align-items.

flex-start flex-end center baseline stretch', + 'pl': '

Wyrównuje element z atrybutem flex wzdłuż osi poprzecznych nadpisując wartość właściwości align-items.

flex-start flex-end center baseline stretch', + 'cs': '

Určuje zarovnání prvku ve podle vedlejší osy, přebíjí hodnotu align-items.

flex-start flex-end center baseline stretch', + 'ja': '

アイテムを直行軸 (cross axis) に沿って配置します。align-itemsの値を上書きします。

flex-start flex-end center baseline stretch', + 'hu': '

A másodlagos kereszttengely mentén igazít egy flex elemet, felülírva a align-items-ben megadott értéket.

flex-start flex-end center baseline stretch', + 'eo': '

Vicigas transversakse fleksajn elementojn, anstataŭigante la align-items valoron.

flex-start flex-end center baseline stretch', + 'sv': '

Justerar ett flex-objekt längs med motsata axeln, överskrider värdet från align-items.

flex-start flex-end center baseline stretch', + 'uk': '

Вирівнює flex-елемент вздовж перетинної осі, перекриваючи значення властивості align-items.

flex-start flex-end center baseline stretch', + 'hi': '

छैतिज रूप से किसी विशिष्ट वस्तु के लिए नियम प्रदान करता है, align-items के नियमों को न मानते हुए।

flex-start flex-end center baseline stretch', + 'sr': '

Поравњава појединачни флекс елемент дуж попречне осе надјачавајући вредност align-items.

flex-start flex-end center baseline stretch', + 'bs': '

Poravnava pojedinačni fleks element duž poprečne ose nadjačavajući vrijednost.

flex-start flex-end center baseline stretch', + 'hr': '

Poravnava pojedinačni fleks element duž poprečne osi nadjačavajući vrijednost.

flex-start flex-end center baseline stretch', + 'nl': '

Lijnt een flex element uit over de dwarsas, en overschrijft de waarde van align-items.

flex-start flex-end center baseline stretch', + 'ta': '

align-items மதிப்புகளை புறக்கணித்து, குறுக்கு அச்சு வழியாக உருப்படிகளை ஒழுங்குபடுத்துகிறது.

flex-start flex-end center baseline stretch', + 'te': '

align-item విలువను అధిగమించి, క్రాస్ యాక్సిస్ వెంట ఒక ఫ్లెక్స్ ఐటెమ్‌ను సమలేఖనం చేస్తుంది. ముగింపు flex-start flex-end center baseline stretch', + 'ml': '

align-items ഇനെ അസാധു ആക്കി കൊണ്ട്, ക്രോസ്സ് അക്ഷത്തിൽ ഒരു ഫ്ലെക്സ് ഇനത്തെ വിന്യസിക്കുന്നു

flex-start flex-end center baseline stretch', + 'el': '

Ευθυγραμμίζει ένα αντικείμενο flex κατά μήκος του εγκάρσιου άξονα, παρακάμπτοντας την αξία του align-items.

flex-start flex-end center baseline stretch', + 'mk': '

Подредува flex element по вертикалната оска, презапишувајќи ја align-items вредноста.

flex-start flex-end center baseline stretch', + 'lv': '

Novieto flex vienību attiecībā pret šķērsojošo asi, pārrakstot align-items vērtību.

flex-start flex-end center baseline stretch', + 'id': '

Sejajarkan item fleksibel di sepanjang sumbu silang yang menimpa objek align-items value.

flex-start flex-end center baseline stretch', + 'ar': '

محاذاة عنصر فلكس على طول المحور الثانوي, متجاوزا قيمة align-items.

flex-start flex-end center baseline stretch', + 'ca': '

Alinea un element flex al llarg de l\'eix transversal, anul·lant el valor de align-items

flex-start flex-end center baseline stretch', + 'da': '

Justerer et flex-element langs den tværgående akse, og underkender værdien af align-items.

flex-start flex-end center baseline stretch', + 'et': '

Joondab flex elemendi mööda risttelge, ja võtab üle align-items väärtuse.

flex-start flex-end center baseline stretch', + 'fi': '

Kohdistaa yksittäisen flex-elementin poikittaisakselin suuntaisesti ohittaen align-items-ominaisuudelle määritetyn arvon.

flex-start flex-end center baseline stretch', + 'gl': '

Aliña un elemento flex no eixe transversal, sobrescribindo o valor de align-items.

flex-start flex-end center baseline stretch', + 'th': '

จัดเรียง flex item ตามแกนขวาง, โดยทับค่าของคำสั่ง align-items

flex-start flex-end center baseline stretch', + 'mn': '

align-items утгыг дарж, flex item-г хөндлөн тэнхлэгийн дагуу байрлуулна.

flex-start flex-end center baseline stretch' + }, + 'flex-direction': { + 'en': '

Defines the direction of the main axis.

row (default) row-reverse column column-reverse', + 'he': '

מגדיר את הכיוון של הציר הראשי.

row (default) row-reverse column column-reverse', + 'ro': '

Definește direcția axei principale.

row (default) row-reverse column column-reverse', + 'bg': '

Определя посоката на основната ос.

row (default) row-reverse column column-reverse', + 'de': '

Legt die Ausrichtung der Hauptachse fest.

row (default) row-reverse column column-reverse', + 'es': '

Define la dirección del eje principal.

row (default) row-reverse column column-reverse', + 'pt-br': '

Define a direção do eixo principal.

row (default) row-reverse column column-reverse', + 'fr': '

Définit la direction de l\'axe principal.

row (default) row-reverse column column-reverse', + 'ru': '

Задает направление основной оси.

row (default) row-reverse column column-reverse', + 'fa': '

جهت آیتم ها را مشخص می کند.

row (default) row-reverse column column-reverse', + 'zh-cn': '

定义主轴的方向。

row (default) row-reverse column column-reverse', + 'zh-tw': '

定義主軸的方向。

row (default) row-reverse column column-reverse', + 'tr': '

main axis\'in yönünü belirler.

row (default) row-reverse column column-reverse', + 'az': '

Main axis\'in yönünü təyin edər.

row (default) row-reverse column column-reverse', + 'it': '

Definisce la direzione dell\'asse principale

row (default) row-reverse column column-reverse', + 'ko': '

정렬할 방향을 지정합니다.

row (default) row-reverse column column-reverse', + 'lt': '

Nustato pagrindinės ašies kryptį.

row (default) row-reverse column column-reverse', + 'vi': '

Xác định hướng của trục chính.

row (default) row-reverse column column-reverse', + 'pl': '

Określa kierunek głównej osi.

row (default) row-reverse column column-reverse', + 'cs': '

Určuje směr hlavní osy.

row (default) row-reverse column column-reverse', + 'ja': '

主軸 (main axis) の方向を指定します。

row (default) row-reverse column column-reverse', + 'hu': '

Definiálja az elsődleges főtengely irányát.

row (default) row-reverse column column-reverse', + 'eo': '

Difinas la direkton de la ĉefa akso.

row (default) row-reverse column column-reverse', + 'sv': '

Definierar huvudaxelns håll.

row (default) row-reverse column column-reverse', + 'uk': '

Визначає напрямок головної осі.

row (default) row-reverse column column-reverse', + 'hi': '

मुख्य धुरी की दिशा परिभाषित करता है।

row (default) row-reverse column column-reverse', + 'sr': '

Одређује правац главне осе.

row (default) row-reverse column column-reverse', + 'bs': '

Određuje pravac glavne ose.

row (default) row-reverse column column-reverse', + 'hr': '

Određuje pravac glavne osi.

row (default) row-reverse column column-reverse', + 'nl': '

Definieert de richting van de hoofdas.

row (default) row-reverse column column-reverse', + 'ta': '

முக்கிய அச்சு திசையை வரையறுக்கிறது.

row (default) row-reverse column column-reverse', + 'te': '

ప్రధాన అక్షం యొక్క దిశను నిర్వచిస్తుంది.

row (default) row-reverse column column-reverse', + 'ml': '

പ്രധാന അക്ഷത്തിന്റെ ദിശ നിർവ്വചിക്കുന്നു.

row (default) row-reverse column column-reverse', + 'el': '

Ορίζει την κατεύθυνση του κύριου άξονα.

row (default) row-reverse column column-reverse', + 'mk': '

Ја одредува насоката на хоризонталната оска.

row (default) row-reverse column column-reverse', + 'lv': '

Nodefinē galvenās ass virzienu.

row (default) row-reverse column column-reverse', + 'id': '

Tentukan arah sumbu utama.

row (default) row-reverse column column-reverse', + 'ar': '

تحديد اتجاه المحور الرئيسي.

row (default) row-reverse column column-reverse', + 'ca': '

Defineix la direcció de l\'eix principal.

row (default) row-reverse column column-reverse', + 'da': '

Definerer hovedaksens retning.

row (default) row-reverse column column-reverse', + 'et': '

Määrab põhitelje suuna

row (default) row-reverse column column-reverse', + 'fi': '

Määrittää pääakselin suunnan.

row (oletusarvo) row-reverse column column-reverse', + 'gl': '

Define a dirección do eixe principal.

row row-reverse column column-reverse', + 'th': '

กำหนดทิศทางของแกนหลัก

row (default) row-reverse column column-reverse', + 'mn': '

Үндсэн тэнхлэгийн чиглэлийг тодорхойлно.

row (default) row-reverse column column-reverse' + }, + 'flex-flow': { + 'en': '

Shorthand property for flex-direction and flex-wrap.

<flex-direction> <flex-wrap>', + 'he': '

קיצור בשביל flex-direction ו-flex-wrap.

<flex-direction> <flex-wrap>', + 'ro': '

Scurtătura pentru flex-direction și flex-wrap.

<flex-direction> <flex-wrap>', + 'bg': '

Съкратена версия на flex-direction and flex-wrap.

<flex-direction> <flex-wrap>', + 'de': '

Kurzschreibweise für flex-direction und flex-wrap.

<flex-direction> <flex-wrap>', + 'pt-br': '

Propriedade abreviada para flex-direction e flex-wrap.

<flex-direction> <flex-wrap>', + 'es': '

Abreviación de las propiedades de flex-direction and flex-wrap.

<flex-direction> <flex-wrap>

', + 'fr': '

Raccourci pour flex-direction et flex-wrap.

<flex-direction> <flex-wrap>', + 'ru': '

Свойство для быстрой записи flex-direction и flex-wrap.

<flex-direction> <flex-wrap>', + 'fa': '

اکنون به کمک flex-flow شما می‌توانید مقادیری که برای flex-direction و flex-wrap در نظر دارید را در یک خاصیت بنویسید.

', + 'zh-cn': '

flex-direction和flex-wrap的缩写性质。

<flex-direction> <flex-wrap>', + 'zh-tw': '

flex-direction和flex-wrap的縮寫性質。

<flex-direction> <flex-wrap>', + 'tr': '

flex-direction ve flex-wrap için kısa yazım özelliği.

<flex-direction> <flex-wrap>', + 'az': '

flex-direction və flex-wrap üçün qısa yazım özəlliyi.

<flex-direction> <flex-wrap>', + 'it': '

Scorciatoia per le proprietà flex-direction e flex-wrap.

<flex-direction> <flex-wrap>', + 'ko': '

다음의 속성들을 간략히 한 속성입니다: flex-direction and flex-wrap.

<flex-direction> <flex-wrap>', + 'lt': '

Sutrumpinta komanda atstojanti flex-direction ir flex-wrap.

<flex-direction> <flex-wrap>', + 'vi': '

Viết tắt cho từ flex-direction và từ flex-wrap.

<flex-direction> <flex-wrap>', + 'pl': '

Skrócona wersja flex-direction i flex-wrap.

<flex-direction> <flex-wrap>', + 'cs': '

Zkrácená verze vlastností flex-direction a flex-wrap.

<flex-direction> <flex-wrap>', + 'ja': '

flex-directionとflex-wrapのショートハンドプロパティーです。

<flex-direction> <flex-wrap>', + 'hu': '

Rövidítésként szolgáló összevonása a flex-direction és a flex-wrap tulajdonságoknak.

<flex-direction> <flex-wrap>', + 'eo': '

Mallongita trajto por flex-direction kaj flex-wrap.

<flex-direction> <flex-wrap>', + 'sv': '

Kort version av flex-direction och flex-wrap.

<flex-direction> <flex-wrap>', + 'uk': '

Скорочена властивість для flex-direction та flex-wrap.

<flex-direction> <flex-wrap>', + 'hi': '

शोर्ट हैंड प्रॉपर्टी flex-direction एवं flex-wrap के लिए।

<flex-direction> <flex-wrap>', + 'sr': '

Скраћено својство за flex-direction и flex-wrap.

<flex-direction> <flex-wrap>', + 'bs': '

Skraćeno svojstvo za flex-direction i flex-wrap.

<flex-direction> <flex-wrap>', + 'hr': '

Skraćeno svojstvo za flex-direction i flex-wrap.

<flex-direction> <flex-wrap>', + 'nl': '

Een verkorte eigenschap voor een combinatie van flex-direction en flex-wrap.

<flex-direction> <flex-wrap>', + 'ta': '

flex-direction and flex-wrap இரண்டின் சுருக்கெழுத்து.

<flex-direction> <flex-wrap>', + 'te': '

flex-direction మరియు flex-wrap కోసం సంక్షిప్తలిపి ఆస్తి.

<flex-direction > <flex-wrap >', + 'ml': '

flex-direction and flex-wrap ോർട്ട്ഹാൻഡ്.

<flex-direction> <flex-wrap>', + 'el': '

Συντομογραφική ιδιότητα για τα flex-direction και flex-wrap.

<flex-direction> <flex-wrap>', + 'mk': '

Скратена верзија на flex-direction и flex-wrap.

<flex-direction> <flex-wrap>', + 'lv': '

flex-direction un flex-wrap saīsināsinātā versija.

<flex-direction> <flex-wrap>', + 'id': '

Properti singkatan untuk flex-direction and flex-wrap.

<flex-direction> <flex-wrap>', + 'ar': '

خاصية مختصرة لـ flex-direction و flex-wrap.

<flex-direction> <flex-wrap>', + 'ca': '

Abreujament de les propietats de flex-direction and flex-wrap.

<flex-direction> <flex-wrap>

', + 'da': '

Forkortelse for flex-direction og flex-wrap.

<flex-direction> <flex-wrap>', + 'et': '

Lühendatud omadus, mis ühendab flex-direction ja flex-wrap.

<flex-direction> <flex-wrap>', + 'fi': '

Ominaisuuksien flex-direction ja flex-wrap yhdistelmä.

<flex-direction> <flex-wrap>', + 'gl': '

Propiedade-atallo para flex-direction e flex-wrap.

<flex-direction> <flex-wrap>', + 'th': '

เป็นคำสั่งย่อของ flex-direction และ flex-wrap.

<flex-direction> <flex-wrap>', + 'mn': '

flex-direction болон flex-wrap-д зориулсан товчилсон проперти.

<flex-direction> <flex-wrap>' + }, + 'flex-wrap': { + 'en': '

Specifies whether flex items are forced on a single line or can be wrapped on multiple lines.

nowrap (default) wrap wrap-reverse', + 'he': '

מציין אם פריטי flex יהיו בשורה אחת או יכולים להתפרס ("להעטף" - wrap) בכמה שורות.

nowrap (default) wrap wrap-reverse', + 'ro': '

Specifică daca elementele flex sunt forțate pe o singură linie sau pot fi impărțit pe mai multe linii.

nowrap (default) wrap wrap-reverse', + 'bg': '

Определя дали flex елементите са на един ред или могат да бъдат разпределени на много редове.

nowrap (default) wrap wrap-reverse', + 'de': '

Legt fest, ob die flex-Elemente in eine Zeile gezwängt werden oder auf mehrere Zeilen umgebrochen werden können.

nowrap (default) wrap wrap-reverse', + 'pt-br': '

Especifica se os itens flex são forçados em um linha única ou podem quebrar em múltiplas linhas.

nowrap (default) wrap wrap-reverse', + 'es': '

Especifica si los elementos flex son forzados a una sola línea o pueden ser envueltos en multiples líneas.

nowrap (default) wrap wrap-reverse', + 'fr': '

Spécifie si les éléments flex sont forcés à être sur une seule ligne ou peuvent être enveloppés sur plusieurs lignes.

nowrap (default) wrap wrap-reverse', + 'ru': '

Указывает, нужно ли чтоб элементы принудительно находились в одном ряду или автоматически переносились.

nowrap (default) wrap wrap-reverse', + 'fa': '

در حالت عادی همه flex item ها در یک خط قرار می‌گیرند. به کمک خاصیت flex-wrap شما می‌توانید مشخص کنید که flex item ها در چندین خط قرار بگیرند.

nowrap (default) wrap wrap-reverse', + 'zh-cn': '

定义flex元素必须在单行或自动换行成多行。

nowrap (default) wrap wrap-reverse', + 'zh-tw': '

定義flex元素必須在單行或自動換行成多行。

nowrap (default) wrap wrap-reverse', + 'tr': '

Flex öğelerin tek satıra sığmasını ya da çoklu satırlara bölünmesini belirler.

nowrap (default) wrap wrap-reverse', + 'az': '

Flex elementlərin tək sətirə sığmasını və ya çoxlu sətirlərə bölünməsini təyin edər.

nowrap (default) wrap wrap-reverse', + 'it': '

Specifica se gli elementi flex vengono disposti forzatamente su una singola linea o se possono occupare più linee

nowrap (default) wrap wrap-reverse', + 'ko': '

Flex 요소들을 한 줄 또는 여러 줄에 걸쳐 정렬합니다.

nowrap (default) wrap wrap-reverse', + 'lt': '

Nusako ar elastiški elementai turi būti sutalpinti vienoje eilutėje, ar gali būti paskirstyti per kelias eilutes.

nowrap (default) wrap wrap-reverse', + 'vi': '

Xác định xem các hạng mục flex phải trên một dòng hoặc có thể quấn trên nhiều dòng.

nowrap (default) wrap wrap-reverse', + 'pl': '

Określa czy elementy z atrybutem flex muszą być ściśnięte w jednym wierszu czy mogą być rozproszone.

nowrap (default) wrap wrap-reverse', + 'cs': '

Určuje, zda budou prvky na jednom řádku, nebo se mohou rozdělit na více řádků.

nowrap (default) wrap wrap-reverse', + 'ja': '

アイテムを強制的に一行に並べるか、複数行へ折り返すかを指定します。

nowrap (default) wrap wrap-reverse', + 'hu': '

Meghatározza, hogy a flex elemek egy sorba vannak kényszerítve vagy megtörhetnek több sorba.

nowrap (default) wrap wrap-reverse', + 'eo': '

Indikas ĉu fleksaj elementoj devige estu sur nura linio aŭ faldkapeblas je pluraj linioj.

nowrap (default) wrap wrap-reverse', + 'sv': '

Specificerar on flex-objekt är låsta till en rad eller om dom får flöda över till flera rader.

nowrap (default) wrap wrap-reverse', + 'uk': '

Визначає, чи будуть елементи знаходитись в одному рядку, чи будуть перенесені до наступних рядків.

nowrap (default) wrap wrap-reverse', + 'hi': '

यह निर्दिष्ठ करता है की कोई वस्तु एक पंक्ति अथवा कई पंक्तियों में आएगी।

nowrap (default) wrap wrap-reverse', + 'sr': '

Одређује да ли ће флекс елементи стајати у једном реду или ће прећи у нове редове.

nowrap (default) wrap wrap-reverse', + 'bs': '

Određuje da li će fleks elementi stajati u jednom redu ili će preći u nove redove.

nowrap (default) wrap wrap-reverse', + 'hr': '

Određuje da li će fleks elementi stajati u jednom redu ili će prijeći u nove redove.

nowrap (default) wrap wrap-reverse', + 'nl': '

Specifieert of de flex elementen op een enkele lijn geforceerd worden, of ze over meerdere lijnen gewikkeld worden.

nowrap (default) wrap wrap-reverse', + 'ta': '

ஒரு ஒற்றை வரியில் பொருட்களை கட்டாயமாக்க வேண்டுமா அல்லது பல வரிகளில் மூடப்பட்டிருக்கலாம் என்பதைக் குறிப்பிடுகிறது.

nowrap (default) wrap wrap-reverse', + 'te': '

ఫ్లెక్స్ ఐటెమ్‌లు ఒకే పంక్తిలో బలవంతం చేయబడుతున్నాయా లేదా బహుళ పంక్తులలో చుట్టవచ్చా అని నిర్దేశిస్తుంది.

nowrap (default) wrap wrap-reverse', + 'ml': '

ഫ്ലെക്സിങ് ഇനങ്ങളെ ഒരൊറ്റ വരിയിൽ നിർബന്ധിതരാണോ അല്ലെങ്കിൽ ഒന്നിലധികം വരികളിൽ പൊതിഞ്ഞ് വരാമോ എന്ന് നിർദേശിക്കുന്നു.

nowrap (default) wrap wrap-reverse', + 'el': '

Προσδιορίζει κατά πόσο τα αντικείμενα flex στριμώχνονται σε μία γραμμή ή μπορούν να τυλιχθούν σε πολλαπλές γραμμές.

nowrap (default) wrap wrap-reverse', + 'mk': '

Специфицира дали flex елементите се присилени во еден ред или можат да бидат распределени во повеќе редови.

nowrap (default) wrap wrap-reverse', + 'lv': '

Norāda to, vai flex vienības tiek novietotas vienā rindā vai var tik izvietotas vairākās rindās.

nowrap (default) wrap wrap-reverse', + 'id': '

Tentukan apakah flex objek dipaksa pada satu garis atau dapat dibungkus pada beberapa baris.

nowrap (default) wrap wrap-reverse', + 'ar': '

تحديد اذا كانت عناصر فلكس يجب ان تكون في سطر واحد او ممكن ان تتمدد الى اكثر من سطر.

nowrap (default) wrap wrap-reverse', + 'ca': '

Especifica si els elements flex són forçats a una sola línia o poden ser encapçulats en multiples línies.

nowrap (default) wrap wrap-reverse', + 'da': '

Fastsætter om flex-elementer skal tvinges ind på en enkelt linje eller må fordeles over flere linjer.

nowrap (default) wrap wrap-reverse', + 'et': '

Täpsustab, kas flex elemendd on surutud on ühele reale või on nad pakitud mitmele reale.

nowrap (default) wrap wrap-reverse', + 'fi': '

Määrittää, pakotetaanko elementit yhdelle riville vai voivatko ne rivittyä useammalle riville.

nowrap (oletusarvo) wrap wrap-reverse', + 'gl': '

Determina se os elementos flex teñen que apertarse para coller nunha soa liña ou se se poden distribuír en múltiples liñas.

nowrap wrap wrap-reverse', + 'th': '

กำหนดว่า flex items จะถูกบังคับให้อยู่ในบรรทัดเดียว หรือสามารถพับไปอยู่หลายบรรทัด

nowrap (default) wrap wrap-reverse', + 'mn': '

Flex items-г нэг мөрөнд шахах эсвэл олон мөрөнд тарааж байрлуулах уу гэдгийг заана.

nowrap (default) wrap wrap-reverse' + }, + 'justify-content': { + 'en': '

Aligns flex items along the main axis.

flex-start (default) flex-end center space-between space-around space-evenly', + 'he': '

יישור פריטי flex לאורך הציר הראשי.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ro': '

Aliniază elementele flex de-a lungul axei principale.

flex-start (default) flex-end center space-between space-around space-evenly', + 'bg': '

Подрежда flex елементи по дължината на основната ос.

flex-start (default) flex-end center space-between space-around space-evenly', + 'de': '

Richtet die flex-Elemente entlang der Hauptachse aus.

flex-start (default) flex-end center space-between space-around space-evenly', + 'pt-br': '

Alinha os itens flex ao longo do eixo principal.

flex-start (default) flex-end center space-between space-around space-evenly', + 'es': '

Alinea los elementos flex a lo largo del eje principal.

flex-start (default) flex-end center space-between space-around space-evenly', + 'fr': '

Aligne les éléments flex selon l\'axe principal.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ru': '

Выравнивает flex-элементы вдоль главной оси.

flex-start (default) flex-end center space-between space-around space-evenly', + 'fa': '

با استفاده از این خاصیت می‌توانید نحوه چیدمان آیتم‌ها بر روی محور اصلی را تعیین کنید (به یاد داشته باشید همانطور که گفتیم اگر خاصیت flex-direction برابر column یا column-reverse باشد، محور اصلی عمودی خواهد بود).

flex-start (default) flex-end center space-between space-around space-evenly', + 'zh-cn': '

将flex元素和主轴对齐。

flex-start (default) flex-end center space-between space-around space-evenly', + 'zh-tw': '

將flex元素和主軸對齊。

flex-start (default) flex-end center space-between space-around space-evenly', + 'tr': '

Flex öğeleri main axis boyunca hizalar.

flex-start (default) flex-end center space-between space-around space-evenly', + 'az': '

Flex elementləri main axis boyunca nizamlayar.

flex-start (default) flex-end center space-between space-around space-evenly', + 'it': '

Allinea gli elementi flex lungo l\'asse principale.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ko': '

Flex 요소들을 가로선 상에서 정렬합니다.

flex-start (default) flex-end center space-between space-around space-evenly', + 'lt': '

Lygiuoja elastiškus elementus palei pagrindinę ašį.

flex-start (default) flex-end center space-between space-around space-evenly', + 'vi': '

Sắp xếp các hạng mục flex dọc theo trục chính.

flex-start (default) flex-end center space-between space-around space-evenly', + 'pl': '

Wyrównuje elementy z atrybutem flex wzdłuż głownej osi.

flex-start (default) flex-end center space-between space-around space-evenly', + 'cs': '

Zarovnává prvky ve směru hlavní osy.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ja': '

アイテムを主軸 (main axis) に沿って配置します。

flex-start (default) flex-end center space-between space-around space-evenly', + 'hu': '

Az elsődleges főtengely mentén igazítja a flex elemeket.

flex-start (default) flex-end center space-between space-around space-evenly', + 'eo': '

Liniigas fleksajn elementojn laŭĉefakse.

flex-start (default) flex-end center space-between space-around space-evenly', + 'sv': '

Justerar flex-objekt längs med huvudaxeln.

flex-start (default) flex-end center space-between space-around space-evenly', + 'uk': '

Вирівнює flex-елементи вздовж головної осі.

flex-start (default) flex-end center space-between space-around space-evenly', + 'hi': '

वस्तुओं को छैतिज रूप से संरेखित करता है।

flex-start (default) flex-end center space-between space-around space-evenly', + 'sr': '

Поравњава флекс елементе дуж главне осе.

flex-start (default) flex-end center space-between space-around space-evenly', + 'bs': '

Poravnava fleks elemente duž glavne ose.

flex-start (default) flex-end center space-between space-around space-evenly', + 'hr': '

Poravnava fleks elemente duž glavne osi.

flex-start (default) flex-end center space-between space-around space-evenly', + 'nl': '

Lijnt de flex elementen uit langs de hoofdas.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ta': '

முக்கிய அச்சில் உருப்படிகளை சீரமைக்கும்.

flex-start (default) flex-end center space-between space-around space-evenly', + 'te': '

ప్రధాన అక్షంతో పాటు ఫ్లెక్స్ అంశాలను సమలేఖనం చేస్తుంది.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ml': '

ഫ്ലെക്സി ഇനങ്ങളെ മെയിൻ ആക്സിസിൽ വിന്യസിക്കുന്നു

flex-start (default) flex-end center space-between space-around space-evenly', + 'el': '

Ευθυγραμμίζει αντικείμενα flex κατά μήκος του κύριου άξονα.

flex-start (default) flex-end center space-between space-around space-evenly', + 'mk': '

Подредува flex елементи по хоризонталната оска.

flex-start (default) flex-end center space-between space-around space-evenly', + 'lv': '

Novieto flex vienību attiecībā pret galveno asi.

flex-start (default) flex-end center space-between space-around space-evenly', + 'id': '

Sejajarkan flex objek pada sepanjang sumbu utama.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ar': '

محاذاة عناصر فلكس على طول المحور الرئيسي.

flex-start (default) flex-end center space-between space-around space-evenly', + 'ca': '

Alinea els elements flex al llarg de l\'eix principal.

flex-start (default) flex-end center space-between space-around space-evenly', + 'da': '

Justerer flex-elementer langs hovedaksen.

flex-start (default) flex-end center space-between space-around space-evenly', + 'et': '

Joondab flex elemendid mööda põhitelge.

flex-start (default) flex-end center space-between space-around space-evenly', + 'fi': '

Kohdistaa flex-elementit pääakselin suuntaisesti.

flex-start (oletusarvo) flex-end center space-between space-around space-evenly', + 'gl': '

Aliña os elementos flex no eixe principal.

flex-start flex-end center space-between space-around', + 'th': '

จัดเรียง flex items ตามแกนหลัก

flex-start (default) flex-end center space-between space-around space-evenly', + 'mn': '

Үндсэн тэнхлэгийн дагуу flex item-ийг байрлуулна.

flex-start (default) flex-end center space-between space-around space-evenly' + }, + 'order': { + 'en': '

Specifies the order of the flex item.

<integer> (... -1, 0 (default), 1, ...)', + 'he': '

מציין את הסדר של פריט flex.

<integer> (... -1, 0 (default), 1, ...)', + 'ro': '

Specifică ordinea elementelor flex.

<integer> (... -1, 0 (default), 1, ...)', + 'bg': '

Определя реда на flex елемента.

<integer> (... -1, 0 (default), 1, ...)', + 'de': '

Legt die Reihenfolge der flex-Elemente fest.

<integer> (... -1, 0 (default), 1, ...)', + 'pt-br': '

Especifica a ordem de um item flex.

<integer> (... -1, 0 (default), 1, ...)', + 'es': '

Especifica el orden de los elementos flex.

<integer> (... -1, 0 (default), 1, ...)', + 'fr': '

Spécifie l\'ordre de l\'élément flex.

<integer> (... -1, 0 (default), 1, ...)', + 'ru': '

Указывает порядок flex-элемента.

<integer> (... -1, 0 (default), 1, ...)', + 'fa': '

به کمک خاصیت order شما می‌توانید ترتیب چینش Flex itemها را مشخص کنید. مقادیر این خاصیت اعداد می‌باشند و هرچه عدد کوچکتر باشد اولویت آیتم بالاتر خواهد بود..

(... -1, 0 (default), 1, ...) <integer>', + 'zh-cn': '

决定flex元素的顺序。

<integer> (... -1, 0 (default), 1, ...)', + 'zh-tw': '

決定flex元素的順序。

<integer> (... -1, 0 (default), 1, ...)', + 'tr': '

Flex öğenin sırasını belirler.

<integer> (... -1, 0 (default), 1, ...)', + 'az': '

Flex elementinin sırasını təyin edər.

<integer> (... -1, 0 (default), 1, ...)', + 'it': '

Specifica l\'ordine degli elementi flex

<integer> (... -1, 0 (default), 1, ...)', + 'ko': '

Flex 요소의 순서를 지정합니다.

<integer> (... -1, 0 (default), 1, ...)', + 'lt': '

Nusako elastiškų elementų eilės tvarką.

<integer> (... -1, 0 (default), 1, ...)', + 'vi': '

Chỉ rõ thứ tự của các hạng mục flex

<itegeer>(... -1, 0 (default), 1, ...) ', + 'pl': '

Określa kolejność elementów z atrybutem flex.

<integer> (... -1, 0 (default), 1, ...)', + 'cs': '

Určuje pořadí prvku v kontejneru.

<integer> (... -1, 0 (default), 1, ...)', + 'ja': '

アイテムの順序を指定します。

<integer> (... -1, 0 (default), 1, ...)', + 'hu': '

Meghatározza a flex elem sorrendiségét.

<integer> (... -1, 0 (default), 1, ...)', + 'eo': '

Precizigas la ordon de la fleksa elemento.

<integer> (... -1, 0 (default), 1, ...)', + 'sv': '

Specificerar ordningen för flex-objekten.

<integer> (... -1, 0 (default), 1, ...)', + 'uk': '

Вказує порядок flex-елементу.

<integer> (... -1, 0 (default), 1, ...)', + 'hi': '

फ्लेक्स आइटम का क्रम निश्चित करता है।

<पूर्णांक> (... -1, 0 (default), 1, ...)', + 'sr': '

Дефинише место појединачног флекс елемента.

<integer> (... -1, 0 (default), 1, ...)', + 'bs': '

Definira mjesto pojedinog fleks elementa.

<integer> (... -1, 0 (default), 1, ...)', + 'hr': '

Definira mjesto pojedinog fleks elementa.

<integer> (... -1, 0 (default), 1, ...)', + 'nl': '

Bepaalt de volgorde van de flex elementen.

<integer> (... -1, 0 (default), 1, ...)', + 'ta': '

உருப்படியின் வரிசையைக் குறிப்பிடுகிறது.

<integer> (... -1, 0 (default), 1, ...)', + 'te': '

ఫ్లెక్స్ ఐటెమ్ యొక్క క్రమాన్ని పేర్కొంటుంది.

< పూర్ణాంకం> (... -1, 0 (default), 1, ...) ', + 'ml': '

ഫ്ളക്സ് ഇനങ്ങളുടെ ക്രമം വ്യക്തമാക്കുന്നു

<integer> (... -1, 0 (default), 1, ...)', + 'el': '

Προσδιορίζει την σειρά του αντικειμένου flex.

<integer> (... -1, 0 (default), 1, ...)', + 'mk': '

Го одредува редоследот на flex елементот.

<integer> (... -1, 0 (default), 1, ...)', + 'lv': '

Norāda flex vienības kārtas numuru.

<integer> (... -1, 0 (default), 1, ...)', + 'id': '

Tentukan urutan flex objek.

<integer> (... -1, 0 (default), 1, ...)', + 'ar': '

تحديد ترتيب عناصر فلكس.

<integer> (... -1, 0 (default), 1, ...)', + 'ca': '

Especifica l\'ordre dels elements flex.

<integer> (... -1, 0 (default), 1, ...)', + 'da': '

Fastsætter rækkefølgen af flex-elementet.

<integer> (... -1, 0 (default), 1, ...)', + 'et': '

Täpsustab flex elemendi järjekorda.

<integer> (... -1, 0 (default), 1, ...)', + 'fi': '

Määrittää yksittäisen flex-elementin järjestyksen.

<integer> (... -1, 0 (oletusarvo), 1, ...)', + 'gl': '

Especifica a orde do elemento flex.

<integer> (... -1, 0, 1, ...)', + 'th': '

กำหนดลำดับของ flex item

<integer> (... -1, 0 (default), 1, ...)', + 'mn': '

Flex item-н байрлах дарааллыг заана.

<integer> (... -1, 0 (default), 1, ...)' + } +}; diff --git a/src/Games/Flexcode/js/game.js b/src/Games/Flexcode/js/game.js new file mode 100644 index 00000000..9dbe85d5 --- /dev/null +++ b/src/Games/Flexcode/js/game.js @@ -0,0 +1,550 @@ +var game = { + colorblind: (localStorage.colorblind && JSON.parse(localStorage.colorblind)) || 'false', + language: window.location.hash.substring(1) || 'en', + difficulty: 'easy', + level: parseInt(localStorage.level, 10) || 0, + answers: (localStorage.answers && JSON.parse(localStorage.answers)) || {}, + solved: (localStorage.solved && JSON.parse(localStorage.solved)) || [], + user: localStorage.user || '', + changed: false, + clickedCode: null, + + start: function() { + // navigator.language can include '-' + // ref: https://developer.mozilla.org/en-US/docs/Web/API/NavigatorLanguage/language + var requestLang = window.navigator.language.split('-')[0]; + if (window.location.hash === '' && requestLang !== 'en' && messages.languageActive.hasOwnProperty(requestLang)) { + game.language = requestLang; + window.location.hash = requestLang; + } + + game.translate(); + $('#level-counter .total').text(levels.length); + $('#editor').show(); + $('#share').hide(); + $('#language').val(game.language); + $('input[value="' + game.colorblind + '"]', '#colorblind').prop('checked', true); + + if (!localStorage.user) { + game.user = '' + (new Date()).getTime() + Math.random().toString(36).slice(1); + localStorage.setItem('user', game.user); + } + + this.setHandlers(); + this.loadMenu(); + game.loadLevel(levels[game.level]); + }, + + setHandlers: function() { + $('#next').on('click', function() { + $('#code').focus(); + + if ($(this).hasClass('disabled')) { + if (!$('.frog').hasClass('animated')) { + game.tryagain(); + } + + return; + } + + $(this).removeClass('animated animation'); + $('.frog').addClass('animated bounceOutUp'); + $('.arrow, #next').addClass('disabled'); + + setTimeout(function() { + if (game.level >= levels.length - 1) { + game.win(); + } else { + game.next(); + } + }, 2000); + }); + + $('#code').on('keydown', function(e) { + if (e.keyCode === 13) { + + if (e.ctrlKey || e.metaKey) { + e.preventDefault(); + game.check(); + $('#next').click(); + return; + } + + var max = $(this).data('lines'); + var code = $(this).val(); + var trim = code.trim(); + var codeLength = code.split('\n').length; + var trimLength = trim.split('\n').length; + + if (codeLength >= max) { + + if (codeLength === trimLength) { + e.preventDefault(); + $('#next').click(); + } else { + $('#code').focus().val('').val(trim); + } + } + } + }).on('input', game.debounce(game.check, 500)) + .on('input', function() { + game.changed = true; + $('#next').removeClass('animated animation').addClass('disabled'); + }); + + $('#editor').on('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() { + $(this).removeClass(); + }); + + $('#labelReset').on('click', function() { + var warningReset = messages.warningReset[game.language] || messages.warningReset.en; + var r = confirm(warningReset); + + if (r) { + game.level = 0; + game.answers = {}; + game.solved = []; + game.loadLevel(levels[0]); + + $('.level-marker').removeClass('solved'); + } + }); + + $('#labelSettings').on('click', function() { + $('#levelsWrapper').hide(); + $('#settings .tooltip').toggle(); + $('#instructions .tooltip').remove(); + }) + + $('#language').on('change', function() { + window.location.hash = $(this).val(); + }); + + $('#difficulty').on('change', function() { + game.difficulty = $('input:checked', '#difficulty').val(); + + // setting height will prevent a slight jump when the animation starts + var $instructions = $('#instructions'); + var height = $instructions.height(); + $instructions.css('height', height); + + var $markers = $('.level-marker'); + + if (game.difficulty == 'hard' || game.difficulty == 'medium') { + $instructions.slideUp(); + + $markers.each(function() { + var $marker = $(this); + if ($marker[0].hasAttribute('title')) { + $marker.attr('data-title', $marker.attr('title')); + $marker.removeAttr('title'); + } + }); + } else { + $instructions.css('height', '').slideDown(); + + $markers.each(function() { + var $marker = $(this); + if ($marker[0].hasAttribute('data-title')) { + $marker.attr('title', $marker.attr('data-title')); + $marker.removeAttr('data-title'); + } + }); + } + }); + + $('#colorblind').on('change', function() { + game.colorblind = $('input:checked', '#colorblind').val(); + + if (game.colorblind == 'true') { + $('.lilypad, .frog').addClass('cb-friendly'); + } else { + $('.lilypad, .frog').removeClass('cb-friendly'); + } + }); + + $('body').on('click', function() { + $('.tooltip').hide(); + clickedCode = null; + }); + + $('.tooltip, .toggle, #level-indicator').on('click', function(e) { + e.stopPropagation(); + }); + + $(window).on('beforeunload', function() { + game.saveAnswer(); + localStorage.setItem('level', game.level); + localStorage.setItem('answers', JSON.stringify(game.answers)); + localStorage.setItem('solved', JSON.stringify(game.solved)); + localStorage.setItem('colorblind', JSON.stringify(game.colorblind)); + }).on('hashchange', function() { + game.language = window.location.hash.substring(1) || 'en'; + game.translate(); + + $('#tweet iframe').remove(); + var html = 'Tweet ' + + 'Follow @thomashpark'; + $('#tweet').html(html); + + if (typeof twttr !== 'undefined') { + twttr.widgets.load(); + } + + if (game.language === 'en') { + history.replaceState({}, document.title, './'); + } + }); + }, + + prev: function() { + this.level--; + + var levelData = levels[this.level]; + this.loadLevel(levelData); + }, + + next: function() { + if (this.difficulty === "hard") { + this.level = Math.floor(Math.random()* levels.length) + } else { + this.level++ + } + + var levelData = levels[this.level]; + this.loadLevel(levelData); + }, + + loadMenu: function() { + levels.forEach(function(level, i) { + var levelMarker = $('').addClass('level-marker').attr({'data-level': i, 'title': level.name}).text(i+1); + + if ($.inArray(level.name, game.solved) !== -1) { + levelMarker.addClass('solved'); + } + + levelMarker.appendTo('#levels'); + }); + + $('.level-marker').on('click', function() { + game.saveAnswer(); + + var level = $(this).attr('data-level'); + game.level = parseInt(level, 10); + game.loadLevel(levels[level]); + }); + + $('#level-indicator').on('click', function() { + $('#settings .tooltip').hide(); + $('#levelsWrapper').toggle(); + $('#instructions .tooltip').remove(); + }); + + $('.arrow.left').on('click', function() { + if ($(this).hasClass('disabled')) { + return; + } + + game.saveAnswer(); + game.prev(); + }); + + $('.arrow.right').on('click', function() { + if ($(this).hasClass('disabled')) { + return; + } + + game.saveAnswer(); + game.next(); + }); + }, + + loadLevel: function(level) { + $('#editor').show(); + $('#share').hide(); + $('#background, #pond').removeClass('wrap').attr('style', '').empty(); + $('#levelsWrapper').hide(); + $('.level-marker').removeClass('current').eq(this.level).addClass('current'); + $('#level-counter .current').text(this.level + 1); + $('#before').text(level.before); + $('#after').text(level.after); + $('#next').removeClass('animated animation').addClass('disabled'); + + var instructions = level.instructions[game.language] || level.instructions.en; + $('#instructions').html(instructions); + + $('.arrow.disabled').removeClass('disabled'); + + if (this.level === 0) { + $('.arrow.left').addClass('disabled'); + } + + if (this.level === levels.length - 1) { + $('.arrow.right').addClass('disabled'); + } + + var answer = game.answers[level.name]; + $('#code').val(answer).focus(); + + this.loadDocs(); + + var lines = Object.keys(level.style).length; + $('#code').height(20 * lines).data("lines", lines); + + var string = level.board; + var markup = ''; + var colors = { + 'g': 'green', + 'r': 'red', + 'y': 'yellow' + }; + + for (var i = 0; i < string.length; i++) { + var c = string.charAt(i); + var color = colors[c]; + + var lilypad = $('
').addClass('lilypad ' + color + (this.colorblind == 'true' ? ' cb-friendly' : '')).data('color', color); + var frog = $('
').addClass('frog ' + color + (this.colorblind == 'true' ? ' cb-friendly' : '')).data('color', color); + + $('
').addClass('bg').css(game.transform()).appendTo(lilypad); + $('
').addClass('bg animated pulse infinite').appendTo(frog); + + $('#background').append(lilypad); + $('#pond').append(frog); + } + + var classes = level.classes; + + if (classes) { + for (var rule in classes) { + $(rule).addClass(classes[rule]); + } + } + + var selector = level.selector || ''; + $('#background ' + selector).css(level.style); + + game.changed = false; + game.applyStyles(); + game.check(); + }, + + loadDocs: function() { + $('#instructions code').each(function() { + var code = $(this); + var text = code.text(); + + if (text in docs) { + code.addClass('help'); + code.on('click', function(e) { + e.stopPropagation(); + + // If click same code when tooltip already displayed, just remove current tooltip. + if ($('#instructions .tooltip').length !== 0 && clickedCode === code){ + $('#instructions .tooltip').remove(); + return; + } + + $('#levelsWrapper').hide(); + $('#settings .tooltip').hide(); + $('#instructions .tooltip').remove(); + var html = docs[text][game.language] || docs[text].en; + var tooltipX = code.offset().left; + var tooltipY = code.offset().top + code.height() + 13; + $('
').html(html).css({ + top: tooltipY, + left: tooltipX + }).appendTo($('#instructions')); + + var getDefaultPropVal = (pValue) => { + if (pValue == '') + return '0' + else if (pValue == '') + return 'row nowrap' + + return pValue; + } + + $('#instructions .tooltip code').on('click', function(event) { + var pName = text + var pValue = event.target.textContent.split(' ')[0]; + pValue = getDefaultPropVal(pValue); + game.writeCSS(pName, pValue) + + game.check(); + }); + clickedCode = code; + }); + } + }); + }, + + applyStyles: function() { + var level = levels[game.level]; + var code = $('#code').val(); + var selector = level.selector || ''; + $('#pond ' + selector).attr('style', code); + game.saveAnswer(); + }, + + check: function() { + game.applyStyles(); + + var level = levels[game.level]; + var lilypads = {}; + var frogs = {}; + var correct = true; + + $('.frog').each(function() { + var position = $(this).position(); + position.top = Math.floor(position.top); + position.left = Math.floor(position.left); + + var key = JSON.stringify(position); + var val = $(this).data('color'); + frogs[key] = val; + }); + + $('.lilypad').each(function() { + var position = $(this).position(); + position.top = Math.floor(position.top); + position.left = Math.floor(position.left); + + var key = JSON.stringify(position); + var val = $(this).data('color'); + + if (!(key in frogs) || frogs[key] !== val) { + correct = false; + } + }); + + if (correct) { + ga('send', { + hitType: 'event', + eventCategory: level.name, + eventAction: 'correct', + eventLabel: $('#code').val() + }); + + if ($.inArray(level.name, game.solved) === -1) { + game.solved.push(level.name); + } + + $('[data-level=' + game.level + ']').addClass('solved'); + $('#next').removeClass('disabled').addClass('animated animation'); + } else { + ga('send', { + hitType: 'event', + eventCategory: level.name, + eventAction: 'incorrect', + eventLabel: $('#code').val() + }); + + game.changed = true; + $('#next').removeClass('animated animation').addClass('disabled'); + } + }, + + saveAnswer: function() { + var level = levels[this.level]; + game.answers[level.name] = $('#code').val(); + }, + + tryagain: function() { + $('#editor').addClass('animated shake'); + }, + + win: function() { + var solution = $('#code').val(); + + this.loadLevel(levelWin); + + $('#editor').hide(); + $('#code').val(solution); + $('#share').show(); + $('.frog .bg').removeClass('pulse').addClass('bounce'); + }, + + transform: function() { + var scale = 1 + ((Math.random() / 5) - 0.2); + var rotate = 360 * Math.random(); + + return {'transform': 'scale(' + scale + ') rotate(' + rotate + 'deg)'}; + }, + + translate: function() { + document.title = messages.title[game.language] || messages.title.en; + $('html').attr('lang', game.language); + + var level = $('#editor').is(':visible') ? levels[game.level] : levelWin; + var instructions = level.instructions[game.language] || level.instructions.en; + $('#instructions').html(instructions); + game.loadDocs(); + + $('.translate').each(function() { + var label = $(this).attr('id'); + if (messages[label]) { + var text = messages[label][game.language] || messages[label].en; + } + + $('#' + label).text(text); + }); + }, + + debounce: function(func, wait, immediate) { + var timeout; + return function() { + var context = this, args = arguments; + var later = function() { + timeout = null; + if (!immediate) func.apply(context, args); + }; + var callNow = immediate && !timeout; + clearTimeout(timeout); + timeout = setTimeout(later, wait); + if (callNow) func.apply(context, args); + }; + }, + + writeCSS: function(pName, pValue){ + var tokens = $('#code').val().trim().split(/[\n:;]+/).filter(i => i); + var keywords = Object.keys(docs); + var content = ''; + var filled = false; + + // Do nothing when click property name inside Tooltip + if (keywords.includes(pValue)) return; + + tokens.forEach(function (token, i){ + var trimmedToken = token.trim(); + if (!keywords.includes(trimmedToken)){ + return; + } + + var append = content !== '' ? '\n' : ''; + if (trimmedToken === pName && !filled) + { + filled = true; + append += trimmedToken + ': ' + pValue + ';'; + } + else if (i + 1 < tokens.length){ + var val = !keywords.includes(tokens[i + 1].trim()) ? tokens[i + 1].trim() : ''; // TODO: Maybe prop value validiation required + append += trimmedToken + ': ' + val + ';'; + } + + content += append; + }); + + if (!filled){ + content += content !== '' ? '\n' : ''; + content += pName + ': ' + pValue + ';'; + } + + $('#code').val(content); + $('#code').focus(); + } +}; + +$(document).ready(function() { + game.start(); +}); diff --git a/src/Games/Flexcode/js/levels.js b/src/Games/Flexcode/js/levels.js new file mode 100644 index 00000000..e5c4165a --- /dev/null +++ b/src/Games/Flexcode/js/levels.js @@ -0,0 +1,1363 @@ +var levels = [ + { + name: 'justify-content 1', + instructions: { + 'en': '

Welcome to Flexcode, a game where you help Froggy and friends by writing CSS code! Guide this frog to the lilypad on the right by using the justify-content property, which aligns items horizontally and accepts the following values:

  • flex-start: Items align to the left side of the container.
  • flex-end: Items align to the right side of the container.
  • center: Items align at the center of the container.
  • space-between: Items display with equal spacing between them.
  • space-around: Items display with equal spacing around them.

For example, justify-content: flex-end; will move the frog to the right.

', + 'he': '

ברוך הבא ל-Flexbox Froggy, משחק שבו אתם עוזרים ל-Froggy וחבריו על ידי כתיבת קוד CSS! שימו את הצפרדע על העלה בצד ימין בשימוש בתכונה justify-content, שגורמת ליישור הפריטים ב-flex על גבי הציר האופקי ומקבלת את הערכים הבאים:

  • flex-start: פריטים מיושרים לצד השמאלי של הקונטיינר.
  • flex-end: פריטים מיושרים לצד הימני של הקונטיינר.
  • center: פריטים מיושרים למרכז של הקונטיינר.
  • space-between: פריטים מוצגים עם מרווחים שווים בינהם.
  • space-around: פריטים מוצגים עם מרווחים שווים מסביבם.

לדוגמא, ;justify-content: flex-end יזיז את הצפרדע לצד ימין.

', + 'ro': '

Bine ai venit la Flexbox Froggy, un joc unde îl ajuți pe Froggy și prietenii lui scriind cod CSS! Ghidează această broască pe nufărul din partea dreapta utilizând proprietatea justify-content, care aliniază elementele orizontal și acceptă următoarele valori:

  • flex-start: Elementele se aliniază pe partea stangă a containerului.
  • flex-end: Elementele se aliniază pe partea dreaptă a containerului.
  • center: Elementele se aliniază pe centrul containerului.
  • space-between: Elementele se afișează cu spațiu egal între ele.
  • space-around: Elementele se afișează cu spațiu egal în jurul lor.

De exemplu, justify-content: flex-end; va muta broasca la dreapta.

', + 'bg': '

Добре дошли във Flexbox Froggy, игра, в която вие помагате на жабета и приятели, пишейки CSS код! Насочете това жабче към листото в дясно използвайки свойството justify-content, което подрежда елементи по хоризонталата и приема следните стойности:

  • flex-start: Елементите се подреждат в лявата страна на контейнера.
  • flex-end: Елементите се подреждат в дясната страна на контрейнера.
  • center: Елементите се подреждат в средата на контейнера.
  • space-between: Елементите се подреждат с равно разстояние помежду им.
  • space-around: Елементите се подреждат с равно разстояние около тях.

Например, justify-content: flex-end; ще премести жабчето в дясно.

', + 'de': '

Willkommen bei Flexbox Froggy, einem Spiel, in dem du Froggy und seinen Freunden hilfst, indem du CSS-Code schreibst! Führe diesen Frosch zum Seerosenblatt auf der rechten Seite, indem du die justify-content-Eigenschaft verwendest, die Elemente horizontal ausrichtet und die folgenden Werte akzeptiert:

  • flex-start: Elemente an der linken Seite des Containers ausrichten.
  • flex-end: Elemente an der rechten Seite des Containers ausrichten.
  • center: Elemente an der Mitte des Containers ausrichten.
  • space-between: Elemente mit gleichem Innenabstand ausrichten.
  • space-around: Elemente mit gleichem Außenabstand ausrichten.

Mit justify-content: flex-end; bewegst du den Frosch beispielsweise nach rechts.

', + 'es': '

Bienvenido a Flexbox Froggy, un juego donde ayudarás a Froggy y a sus amigos escribiendo código CSS. Guía a esta rana hacia la hoja de lirio en la derecha, usando la propiedad justify-content, la cual alinea elementos horizontalmente y acepta los siguientes valores:

  • flex-start: Alinea elementos al lado izquierdo del contenedor.
  • flex-end: Alinea elementos al lado derecho del contenedor.
  • center: Alinea elementos en el centro del contenedor.
  • space-between: Muestra elementos con la misma distancia entre ellos.
  • space-around: Muestra elementos con la misma separación alrededor de ellos.

Por ejemplo, justify-content: flex-end; moverá la rana a la derecha.

', + 'pt-br': '

Bem-vindo ao Flexbox Froggy, um jogo onde você pode ajudar Froggy e seus amigos ao escrever código CSS! Guie o sapo à vitória-régia na direita usando a propriedade justify-content, que alinha itens horizontalmente e aceita os seguintes valores:

  • flex-start: Itens se alinham à esquerda do container.
  • flex-end: Itens se alinham à direita do container.
  • center: Itens se alinham no centro do container.
  • space-between: Itens se alinham com distância igual entre eles.
  • space-around: Itens se alinham com distância igual em torno deles.

Por exemplo, justify-content: flex-end; moverá o sapo para a direita.

', + 'fr': '

Bienvenue à Flexbox Froggy, un jeu où vous aidez Froggy la grenouille et ses amis en écrivant du code CSS! Guidez cette grenouille au nénuphar à la droite de l\'étang en utilisant la propriété justify-content, qui aligne les éléments horizontalement et accepte les valeurs suivantes :

  • flex-start : Les éléments s\'alignent au côté gauche du conteneur.
  • flex-end : Les éléments s\'alignent au côté droit du conteneur.
  • center : Les éléments s\'alignent au centre du conteneur.
  • space-between : Les éléments s\'affichent avec un espace égal entre eux.
  • space-around : Les éléments s\'affichent avec un espacement égal à l\'entour d\'eux.

Par exemple, justify-content: flex-end; bougera la grenouille vers la droite.

', + 'ru': '

Добро пожаловать в Flexbox Froggy. Игра, в которой тебе нужно помочь лягушонку Фроги и его друзьям, напиконтейнер CSS код! Направь этого лягушонка на лилию справа, используя свойство justify-content, которое выравнивает элементы горизонтально и принимает следующие значения:

  • flex-start: элементы выравниваются по левой стороне контейнера.
  • flex-end: элементы выравниваются по правой стороне контейнера.
  • center: элементы выравниваются по центру контейнера.
  • space-between: элементы отображаются с одинаковыми отступами между ними.
  • space-around: элементы отображаются с одинаковыми отступами вокруг них.

Например, justify-content: flex-end; сдвинет лягушонка вправо.

', + 'fa': '

به آموزش فلکس باکس خوش آمدید, این قورباغه به شما کمک میکنه که بهتر فلکس باکس رو درک کنید! با استفاده از خصوصیت justify-content می‌تونید نحوه چیدمان آیتم‌ها بر روی محور اصلی را تعیین کنید, این خصوصیت مقادیر زیر را می پذیرد:

  • flex-start: آیتم‌ها از ابتدای flex-line ها چیده می‌شوند.
  • flex-end: آیتم‌ها از انتهای flex-line ها چیده می‌شوند.
  • center: آیتم‌ها از وسط flex-line ها چیده می‌شوند.
  • space-between: آیتم اول در ابتدا و آیتم آخر در انتهای flex-line قرار می گیرند و بقیه آیتم ها در بین آنها با یک فاصله ی برابر قرار می‌گیرند.
  • space-around: آیتم ها با فضای برابر در کنار یکدیگر قرار می‌گیرند.

برای مثال , justify-content: flex-end; قورباغه رو به سمت راست جا به جا میکنه', + 'zh-cn': '

欢迎来到Flexbox Froggy。在游戏中你会靠写CSS代码来帮助青蛙和他的朋友们！请用justify-content属性指引青蛙到右边的荷叶上。这个属性可以水平对齐元素，并且接受以下几个参数：

  • flex-start: 元素和容器的左端对齐。
  • flex-end: 元素和容器的右端对齐。
  • center: 元素在容器里居中。
  • space-between:元素之间保持相等的距离。
  • space-around:元素周围保持相等的距离。

举个例子，justify-content: flex-end;会将青蛙移到右边。

', + 'zh-tw': '

歡迎來到Flexbox Froggy。在遊戲中你會靠寫CSS代碼來幫助青蛙和他的朋友們！請用justify-content屬性指引青蛙到右邊的荷葉上。這個屬性可以水平對齊元素，並且接受一下幾個參數:

  • flex-start: 元素和容器的左端對齊。
  • flex-end: 元素和容器的右端對齊。
  • center: 元素在容器裏居中。
  • space-between: 元素之間保持相等的距離。
  • space-around: 元素周圍保持相等的距離。

舉個例子，justify-content: flex-end;會將青蛙移到右邊。

', + 'tr': '

Flexbox Froggy\'ye, Froggy ve arkadaşlarına CSS kodu yazarak yardım edeceğiniz oyunumuza hoşgeldiniz! justify-content kuralını kullanarak bu kurbağayı sağ taraftaki nilüfer yaprağının üzerine zıplatın. Bu özellik öğeleri yatay olarak hizalar ve şu değerleri alır:

  • flex-start: Öğeleri flexbox container\'ın sol tarafına hizalar.
  • flex-end: Öğeleri flexbox container\'ın sağ tarafına hizalar.
  • center: Öğeleri flexbox container\'ın ortasına hizalar.
  • space-between: Öğeler eşit aralıklarla yatay şekilde yayılır
  • space-around: Öğeler etraflarında eşit aralıklar olacak şekilde yatay şekilde yayılır

Örneğin, justify-content: flex-end; kurbağayı sağa taşır.

', + 'az': '

Flexbox Froggy\'yə, Froggy və dostlarına CSS kodu yazaraq kömək edəcəyiniz oyunumuza xoşgəldiniz! justify-content qaydasını istifadə edərək qurbağanı sağ tərəfdəki zanbaq yarpağının üstünə aparın. Bu özəllik elementləri üfüqi şəkildə nizamlayar və bu dəyərləri qəbul edər:

  • flex-start: Elementləri flexbox container\'inin sol tərəfinə nizamlayar.
  • flex-end: Elementləri flexbox container\'inin sağ tərəfinə nizamlayar.
  • center: Elementləri flexbox container\'inin ortasına nizamlayar.
  • space-between: Elementlər bərabər aralıqlarda üfüqi şəkildə yayılar
  • space-around: Elementlər ətraflarında bərabər aralıqlar şəklində üfüqi şəkildə yayılar

Məsələn, justify-content: flex-end; qurbağanı sağa aparar.

', + 'it': '

Benvenuto su Flexbox Froggy, un gioco in cui devi aiutare Froggy e i suoi amici scrivendo codice CSS! Guida la rana verso la foglia di ninfea sulla destra usando la proprietà justify-content, la quale allinea gli elementi orizzontalmente e accetta i seguenti valori:

  • flex-start: Allinea gli elementi alla sinistra del contenitore.
  • flex-end: Allinea gli elementi alla destra del contenitore.
  • center: Allinea gli elementi al centro del contenitore.
  • space-between: Separa gli elementi con uguale spazio tra di loro.
  • space-around: Separa gli elementi con uguale spazio attorno ad essi.

Per esempio, justify-content: flex-end; muoverà la rana sulla destra.

', + 'ko': '

Flexbox Froggy에 오신 것을 환영합니다! Flexbox Froggy는 Froggy와 친구들 돕는 CSS 코드 게임입니다. 오른쪽의 justify-content 속성을 이용하여 개구리가 수련잎으로 이동할 수 있도록 도와주세요. 이 속성은 다음의 값들을 인자로 받아 요소들을 가로선 상에서 정렬합니다:

  • flex-start: 요소들을 컨테이너의 왼쪽으로 정렬합니다.
  • flex-end: 요소들을 컨테이너의 오른쪽으로 정렬합니다.
  • center: 요소들을 컨테이너의 가운데로 정렬합니다.
  • space-between: 요소들 사이에 동일한 간격을 둡니다.
  • space-around: 요소들 주위에 동일한 간격을 둡니다.

예를 들어, justify-content: flex-end;는 개구리를 오른쪽으로 이동시킵니다.

', + 'lt': '

Sveiki atvykę į "Flexbox Froggy" - žaidimą, kuriame rašydami CSS kodą pagelbėsite varlytei ir jos draugams! Padėkite šiai varlytei nusigauti ant lelijos lapo dešinėje, naudodami komandą justify-content, kuri lygiuoja elementus horizontaliai ir reaguoja šias vertes:

  • flex-start: Elementai lygiuojami supančio elemento kairėje.
  • flex-end: Elementai lygiuojami supančio elemento dešinėje.
  • center: Elementai lygiuojami supančio elemento viduryje.
  • space-between: Elementai atvaizduojami taip, kad tarpai tarp jų būtų vienodi.
  • space-around: Elementai atvaizduojami su vienodais tarpais aplink juos.

Pavyzdžiui, justify-content: flex-end; perstums varlytę į dešinę pusę.

', + 'vi': '

Chào mừng bạn đến Flexbox Froggy, một trò chơi để bạn giúp đỡ Froggy và bạn bè bằng cách viết mã CSS! Hướng dẫn chú ếch này đến lá bông súng bên phải bằng cách sử dụng từ justify-content để sắp xếp các hạng mục theo chiều ngang và chấp nhận các giá trị sau:

  • flex-start: Các hạng mục sẽ được sắp xếp về phía bên trái của hộp chứa.
  • flex-end: Các hạng mục sẽ được sắp xếp về phía bên phải của hộp chứa.
  • center: Các hạng mục sẽ được sắp xếp ở giữa chính của hộp chứa.
  • space-between: Các hạng mục sẽ được trình bày với khoảng cách bằng nhau giữa chúng.
  • space-around: Các hạng mục sẽ được trình bày với khoảng cách bằng nhau xung quanh chúng.

Ví dụ như, justify-content: flex-end; sẽ di chuyển chú ếch qua bên phải.

', + 'pl': '

Witaj w grze Flexbox Froggy. Grze, w której pomagasz żabce Froggy i jej przyjaciołom pisząc kod CSS! Doprowadź żabki do odpowiednich listków przy pomocy justify-content, właściwości która wyrównuje elementy w poziomie i przyjmuje wartości:

  • flex-start: Elementy wyrównują się do lewej strony kontenera.
  • flex-end: Elementy wyrównują się do prawej strony kontenera.
  • center: Elementy wyrównują się do środka kontenera.
  • space-between: Elementy wyświetlają się na całej szerokości kontenera z równymi odstępami.
  • space-around: Każdy z elementów wyświetla się z taką samą ilością przestrzeni wokół.

Na przykład: justify-content: flex-end; przesunie żabę do prawej strony.

', + 'cs': '

Vítejte ve hře Flexbox Froggy, kde pomáháte žabce a jejím kamarádům psaním CSS stylů! Pomozte žabce dostat se na leknín vpravo vlastností justify-content, která zarovnává prvky vodorovně a nabývá následujících hodnot:

  • flex-start: Zarovnat prvky vlevo.
  • flex-end: Zarovnat prvky vpravo.
  • center: Zarovnat prvky na střed.
  • space-between: Rozmístit rovnoměrné mezery mezi prvky.
  • space-around: Rozmístit rovnoměrné mezery kolem prvků.

Například styl justify-content: flex-end; posune žabku doprava.

', + 'ja': '

Flexbox Froggyへようこそ！　これはカエルたちを、CSSコードを書いて助けてあげるゲームです。justify-contentを使って、このカエルを右の蓮の葉まで連れていってあげましょう。このプロパティはアイテムを水平方向に並べるものです。以下の値を取ります。

  • flex-start: アイテムはコンテナーの左側に並びます。
  • flex-end: アイテムはコンテナーの右側に並びます。
  • center: アイテムはコンテナーの中央に並びます。
  • space-between: アイテムはその間に等しい間隔を空けて表示されます。
  • space-around: アイテムはその周囲に等しい間隔を空けて表示されます。

例えば、justify-content: flex-end;はカエルを右側へ動かします。

', + 'hu': '

Üdvözlünk a Flexbox Froggy játékban, ahol segíthetsz Froggy-nak és barátainak egy kis CSS kód írásával! Vezesd ezt a békát a jobb oldali tündérrózsára a justify-content tulajdonság használatával, amely az elemek vízszintes igazítását teszi lehetővé a következő értékek segítségével:

  • flex-start: Az elemek a konténer bal oldalára igazodnak.
  • flex-end: Az elemek a konténer jobb oldalára igazodnak.
  • center: Az elemek a konténer közepére igazodnak.
  • space-between: Az elemek úgy igazodnak, hogy köztük a hely egyenlő mértékben oszlik meg.
  • space-around: Az elemek úgy igazodnak, hogy a körülöttük lévő hely egyenlő maradjon.

Például a justify-content: flex-end; a békát a jobb oldalra mozgatja.

', + 'eo': '

Bonvenon al Flexbox Froggy, ludo en kiu necesas helpi Froggy-on kaj liajn amikojn skribante CSS-an kodon! Gvidu tiun ranon al la dekstra nimfeofolio uzante la justify-content trajton, kiu liniigas elementojn horizontale kaj akceptas la sekvajn valorojn:

  • flex-start: Elementoj linias maldekstraflanken de la ujo.
  • flex-end: Elementoj linias dekstraflanken de la ujo.
  • center: Elementoj linias je la centro de la ujo.
  • space-between: Elementoj afiŝas kun samaj spacoj inter ili.
  • space-around: Elementoj afiŝas kun samaj spacoj ĉirkaŭ ili.

Ekzemple, justify-content: flex-end; movos ranon dekstren.

', + 'sv': '

Välkommen till Flexbox Froggy, ett spel där du hjälper Froggy och vänner genom att skriva CSS-kod! Guida grodan till blombladen till höger genom att använda justify-content attributen, vilket justerar objekten horisontellt och accepterar följande värden:

  • flex-start: Objekt justeras till vänster i containern.
  • flex-end: Objekt justeras till höger i containern.
  • center: Objekt justeras i mitten av containern.
  • space-between: Objekt justeras med lika utrymme mellan varandra.
  • space-around: Objekt justeras med lika utrymme runt omkring varandra.

Till exempel, justify-content: flex-end; flyttar grodan till höger.

', + 'uk': '

Вітаємо у Flexbox Froggy - гра, де ви маєте допомогати жабеняті Фрогі та його друзям написанням CSS коду! Всади жабеня на лист латаття праворуч, за допомогою властивості justify-content, яка вирівнює елементи по горизонталі й набуває таких значень:

  • flex-start: Елементи вирівнюються по лівій стороні контейнера.
  • flex-end: Елементи вирівнюються по правій стороні контейнера.
  • center: Елементи вирівнюються по центру контейнера.
  • space-between: Елементи буде зображено з рівними відступами поміж них.
  • space-around: Елементи буде зображено з рівними відступами навколо них.

Наприклад, justify-content: flex-end; пересуне жабеня праворуч.

', + 'hi': '

आपका Flexbox Froggy में स्वागत है। इस खेल में आप CSS Code लिख कर Froggy और उसके दोस्तों की मदद करते हैं। justify-content प्रॉपर्टी की सहायता से मेंढकों को लिली के पत्तों तक पहुंचाइये। यह प्रॉपर्टी वस्तुओं को छैतिज रूप से संरेखित (पंक्तिबद्ध ) करती है एवं निम्न मान स्वीकार करती है। :

  • flex-start: यह वस्तु को कंटेनर की बाईं तरफ सरेंखित करता है।
  • flex-end: यह वस्तु को कंटेनर की दाईं तरफ सरेंखित करता है।
  • center: यह वस्तु को कंटेनर के मध्य में संरेखित करता है।
  • space-between: यह वस्तुओं को बराबर अंतर के साथ प्रदर्शित करता है।
  • space-around: यह वस्तुओं के चारों ओर के अंतर को प्रदर्शित करता है।

उदाहरण के लिये, justify-content: flex-end; मेंढकों को दायीं तरफ पंहुचा देगा।

', + 'sr': '

Добродошли у Флексбокс Жабца, игру у којој помажете Жабцу и пријатељима пишући CSS код! Смести жабицу на локвањ који је десно користећи justify-content својство (property), које поравњава елементе хоризонтално и прихвата следеће вредности:

  • flex-start: Елементе поравњава на леву страну контејнера.
  • flex-end: Елементе поравњава на десну страну контејнера.
  • center: Елементе поставља у центар контејнера.
  • space-between: Елементе приказује са једнаким растојањем између елемената.
  • space-around: Елементе приказује са једнаким растојањем око елемената.

На пример justify-content: flex-end; ће померити жабицу у десно.

', + 'bs': '

Dobrodošli u Fleksboks Žabca, igru u kojoj pomažete Žabcu i prijateljima pišući CSS kod! Smjesti žabicu na list koji je desno koristeći justify-content svojstvo (property), koje poravnjava elemente horizontalno i prihvata sljedeće vrijednosti:

  • flex-start: Elemente poravnava na lijevu stranu kontejnera.
  • flex-end: Elemente poravnava na desnu stranu kontejnera.
  • center: Elemente postavlja u centar kontejnera.
  • space-between: Elemente prikazuje sa jednakim rastojanjem između elemenata.
  • space-around: Elemente prikazuje sa jednakim rastojanjem oko elemenata.

Na primjer justify-content: flex-end; će pomeriti žabicu u desno.

', + 'hr': '

Dobrodošli u Fleksboks Žapca, igru u kojoj pomažete Žapcu i prijateljima pišući CSS kod! Smjestite žabicu na list koji je desno koristeći justify-content svojstvo (property), koje poravnava elemente horizontalno i prihvaća sljedeće vrijednosti:

  • flex-start: Elemente poravnava na lijevu stranu kontejnera.
  • flex-end: Elemente poravnava na desnu stranu kontejnera.
  • center: Elemente postavlja u centar kontejnera.
  • space-between: Elemente prikazuje sa jednakim rastojanjem između elemenata.
  • space-around: Elemente prikazuje sa jednakim rastojanjem oko elemenata.

Na primjer justify-content: flex-end; će pomaknuti žabicu u desno.

', + 'nl': '

Welkom bij Flexbox Froggy, een spel waar je Froggy en zijn vrienden helpt door CSS-code te schrijven! Leid deze kikker naar het lelieblaadje aan de rechterkant door gebruik te maken van de justify-content eigenschap. Deze lijnt elementen horizontaal uit, en aanvaardt de volgende waarden:

  • flex-start: Elementen aan de linkerkant van de container uitlijnen.
  • flex-end: Elementen aan de rechterkant van de container uitlijnen.
  • center: Elementen in het midden van de container uitlijnen.
  • space-between: Elementen opstellen gelijkmatig verdeeld over de as.
  • space-around: Elementen opstellen met gelijke ruimte aan de buitenkanten op de as.

Bijvoorbeeld, justify-content: flex-end; zal de kikker naar rechts bewegen

', + 'ta': '

Flexbox Froggy-கு வரவேற்கிறோம், இந்த விளையாட்டில் நீங்கள் CSS குறியீடு எழுதி தவளை மற்றும் அதன் நண்பர்களுக்கு உதவலாம்.! பின்வரும் குறியீடு பயன்படுத்தி இந்த தவளை வலதுபுறம் உள்ள இலையின் மீது அமர வழிகாட்டுங்கள். justify-content -என்கிற property கிடைமட்டமாக பொருட்களை சீரமைக்கும் மற்றும் பின்வரும் மதிப்புகளை ஏற்றுக்கொள்ளும்:

  • flex-start: Items வலது பக்கமாக ஒதுக்கப்படும்.
  • flex-end: Items இடது பக்கமாக ஒதுக்கப்படும்.
  • center: Items மையப்பகுதியில் பக்கமாக ஒதுக்கப்படும்.
  • space-between: Items இடைவெளியில் சமமான இடைவெளி விடப்படும்.
  • space-around: Items சுற்றி சமமான இடைவெளி விடப்படும்.

உதாரணமாக, justify-content: flex-end; தவளையை இடது பக்கமாக நகர்த்தி வைக்கும்.

', + 'te': '

CSS కోడ్ రాయడం ద్వారా మీరు ఫ్రాగ్గీ మరియు స్నేహితులకు సహాయపడే ఆట ఫ్లెక్స్‌బాక్స్ ఫ్రాగ్గీకి స్వాగతం! justify-content దీన్ని ఉపయోగించి ఈ కప్పను కుడి వైపున ఉన్న లిలిప్యాడ్‌కు మార్గనిర్దేశం చేయండి, ఇది వస్తువులను అడ్డంగా సమలేఖనం చేస్తుంది మరియు క్రింది విలువలను అంగీకరిస్తుంది:

  • flex-start: వస్తువులను కంటైనర్ యొక్క ఎడమ వైపుకు సమలేఖనం చేయబడతాయి.
  • flex-end: వస్తువులను కంటైనర్ యొక్క కుడి వైపుకు సమలేఖనం చేయబడతాయి.
  • center: వస్తువులను కంటైనర్ మధ్యలో సమలేఖనం చేయబడతాయి.
  • space-between: వస్తువులను వాటి మధ్య సమాన అంతరంతో ప్రదర్శించబడతాయి.
  • space-around: వస్తువులను వాటి చుట్టూ సమాన అంతరాలతో ప్రదర్శించబడతాయి.

ఉదాహరణకు, justify-content: flex-end; కప్పను కుడి వైపుకు కదిలిస్తుంది.

', + 'ml': '

Flexbox Froggy- ലേക്ക് സ്വാഗതം, നിങ്ങൾ Froggy ഉം സുഹൃത്തുക്കളും CSS കോഡ് എഴുതുക വഴി സഹായിക്കുന്ന ഒരു ഗെയിം! justify-content എന്ന പ്രോപ്പർട്ടി ഉപയോഗിച്ച് ഫ്രോഗി യെ വലതു വശത്തുള്ള താമരപ്പൂവിന്റെ ഇലയിലേക്കു എത്തിക്കുക

  • flex-start: Items align to the left side of the container.
  • flex-end: ഇനങ്ങൾ കണ്ടെയ്നറിൽ ഇടത്തേക്ക് അലൈൻ ചെയ്യുക
  • center: വസ്തുക്കൾ അലൈക്റ്ററിന്റെ മധ്യഭാഗത്തേക്ക് അലൈൻ ചെയ്യുക
  • space-between: ഇനങ്ങൾ തമ്മിൽ തുല്യ ഇടവേളയിൽ പ്രദർശിപ്പിക്കും.
  • space-around: ഇനങ്ങൾ അവയ്ക്ക് തുല്യമായ സ്പെയ്സിംഗ് ഉപയോഗിച്ച് കാണാം.

ഉദാഹരണത്തിന്, justify-content: flex-end; വലതുവശത്തേക്ക് തവളയെ മറ്റും.

', + 'el': '

Καλωσήλθατε στο Flexbox Froggy, ένα παιχνίδι όπου βοηθάτε τον Froggy και τους φίλους του γράφοντας κώδικα CSS! Οδηγήστε αυτόν τον βάτραχο στο νούφαρο στα δεξιά χρησιμοποιώντας την ιδιότητα justify-content, που ευθυγραμμίζει αντικείμενα στον οριζόντιο άξονα και αποδέχεται τις εξής αξίες:

  • flex-start: Τα αντικείμενα ευθυγραμμίζονται στην αριστερή πλευρά του container.
  • flex-end: Τα αντικείμενα ευθυγραμμίζονται στην δεξιά πλευρά του container.
  • center: Τα αντικείμενα ευθυγραμμίζονται στο κέντρο του container.
  • space-between: Τα αντικείμενα εμφανίζονται με ίσο διάστημα ανάμεσά τους.
  • space-around: Τα αντικείμενα εμφανίζονται με ίσο διάστημα γύρω τους.

Λόγου χάρη, το justify-content: flex-end; θα μετακινήσει τον βάτραχο στα δεξιά.

', + 'mk': '

Добродојдовте во Flex Froggy, игра каде што му помагате на Froggy и на неговите пријатели со пишување на CSS код! Водете го ова жабче до листот на десно со користење на justify-content својството, кое подредува елементи хоризонтално и ги прима следниве вредности:

  • flex-start: Елементите се подредуваат по левата страна на контејнерот.
  • flex-end: Елементите се подредуваат по десната страна на контејнерот.
  • center: Елементите се подредуваат во средината на контејнерот.
  • space-between: Елементите се подредуваат со еднакво растојание помеѓу нив.
  • space-around: Елементите се подредуваат со еднакво растојание околу нив.

На пример, justify-content: flex-end; ќе ја помести жабата кон десно.

', + 'lv': '

Laipni lūgts Flexbox Froggy spēlē! Šajā spēlē, rakstot CSS kodu, Tu palīdzēsi vardulēnam un viņa draugiem. Lieto justify-content metodi un nogādā vardulēnu līdz ūdensrozei pa labi. Ar šo metodi iespējams modificēt elementu horizontālo novietojumu un tā pieņem šādas vērtības:

  • flex-start: Novieto elementu kreisajā konteinera pusē.
  • flex-end: Novieto elementu labajā konteinera pusē.
  • center: Novieto elementu konteinera vidū.
  • space-between: Elementi tiek novietoti ar vienādu atstarpi starp tiem.
  • space-around: Elementi tiek novietot ar vienādu apkārtesošo laukumu.

Piemēram, justify-content: flex-end; pārvietos vardulēnu pa labi.

', + 'id': '

Selamat datang di Flexbox Froggy, tempat permainan dimana kamu membantu Froggy dan teman-teman dengan menulis kode CSS! Arahkan katak ini ke lilypad di sebelah kanan dengan menggunakan properti justify-content , yang menyelaraskan objek secara:

  • flex-start: Objek selaras dengan wadah sebelah kiri.
  • flex-end:Objek selaras dengan wadah sebelah kanan.
  • center: Objek selaras di tengah wadah
  • space-between: Objek ditampilkan dengan jarak yang sama dengan disekelilingnya.

Misalnya, justify-content: flex-end; akan pindahkan katak ke kanan.

', + 'ar': '

اهلا بك في فروغي فلكسبكس, ساعد فروغي عن طريق كتابة كود CSS! انقل الضفدع الى ورقة الزنبق التي على اليمين باستخدام خاصية justify-content والتي تحاذي العناصر افقيا وتقبل القيم التالية:

  • flex-start: محاذاة العناصر الى الجانب الأيسر من الحاوية.
  • flex-end: محاذاة العناصر الى الجانب الايمن من الحاوية.
  • center: محاذاة العناصر الى وسط الحاوية.
  • space-between: عرض العناصر بتباعد متساوٍ بينهم.
  • space-around: عرض العناصر بتباعد متساو حولهم.

على سبيل المثال, justify-content: flex-end; ستنقل الضفدع الى اليمين.

', + 'ca': '

Benvingut a Flexbox Froggy, un joc on ajudaràs a Froggy i els seus amics escrivint codi CSS. Guia aquesta granota al nenúfar de la dreta, utilitzant la propietat justify-content, que alinea els elements horizontalment i accepta els següents valors:

  • flex-start: Alinea elements al costat esquerra del contenidor.
  • flex-end: Alinea elements al costat dret del contenidor.
  • center: Alinea elements al centre del contenidor.
  • space-between: Mostra elements amb la mateixa distància entre ells.
  • space-around: Mostra elements amb la mateixa separació al voltant d\'ells.

Per exemple, justify-content: flex-end; mourà la granota a la dreta.

', + 'da': '

Velkommen til Flexbox Froggy, et spil hvor du hjælper Froggy og venner ved at kode i CSS! Hjælp denne frø hen til åkanden til højre ved at bruge egenskaben justify-content, som justerer elementer vandret og kan tage følgende værdier:

  • flex-start: Elementer justeres til venstre side af beholderen.
  • flex-end: Elementer justeres til højre side af beholderen.
  • center: Elementer justeres til midten af beholderen.
  • space-between: Elementer vises med fast afstand imellem sig.
  • space-around: Elementer vises med fast afstand omkring sig.

For eksempel vil justify-content: flex-end; flytte frøen til højre.

', + 'et': '

Teretulemast Flexbox Froggy\'sse, see on mäng kus sina aitad Froggy\'t ja tema sõpru kirjutades CSS koodi! Aita see konn parempoolse lege peale kasutades justify-content omadust, mis joondab elemendid horisontaalselt. Sellele saab anda järgmisi väärtusi:

  • flex-start: Elemendid joonduvad konteineri vasakule poole.
  • flex-end: Elemendid joonduvad konteineri paremale poole.
  • center: Elemendid joonduvad konteineri keskele.
  • space-between: Elementide vahele tekib iga kord sama suur vahe.
  • space-around: Elementide ümber tekib iga kord sama suur vahe

Näiteks, justify-content: flex-end; Liigutab konna paremale poole.

', + 'fi': '

Tämä on Flexbox Froggy – peli, jossa kirjoitat CSS-koodia auttaaksesi Froggy-sammakkoa ja sen kavereita! Opasta tämä sammakko oikealla puolella olevalle lumpeenlehdelle määrittämällä ominaisuus justify-content, joka kohdistaa elementit vaakasuunnassa. Voit antaa ominaisuudelle jonkin seuraavista arvoista:

  • flex-start: Elementit kohdistetaan säilön vasempaan reunaan.
  • flex-end: Elementit kohdistetaan säilön oikeaan reunaan.
  • center: Elementit kohdistetaan vaakasuunnassa säilön keskelle.
  • space-between: Elementtien välissä on yhtä paljon tilaa.
  • space-around: Elementtien ympärillä on yhtä paljon tilaa.

Esimerkiksi justify-content: flex-end; siirtää sammakon oikealle.

', + 'gl': '

Benvido a Flexbox Froggy, un xogo no que axudarás a Froggy e aos seus amigos escribindo código CSS! Guía a esta rá ao nenúfar da dereita empregando a propiedade justify-content, que aliña os elementos horizontalmente e acepta os seguintes valores:

  • flex-start: Os elementos alíñanse no lado esquerdo do contedor.
  • flex-end: Os elementos alíñanse no lado dereito do contedor.
  • center: Os elementos alíñanse no centro do contedor.
  • space-between: Os elementos distribúense co mesmo espazo entre eles.
  • space-around: Os elementos distribúense co mesmo espazo darredor deles.

Por exemplo, justify-content: flex-end; moverá a rá á dereita.

', + 'th': '

ยินดีต้อนรับสู่ Flexbox Froggy, เกมที่คุณช่วย Froggy และเพื่อนๆ โดยการเขียนคำสั่ง CSS! นำทางเจ้ากบตัวนี้ไปสู่ใบบัวทางด้านขวาโดยใช้คุณสมบัติ justify-content, ซึ่งจัดเรียง items ตามแนวนอน และรับค่าเหล่านี้ได้:

  • flex-start: เรียง items ไปทางซ้ายของ container
  • flex-end: เรียง items ไปทางขวาของ container
  • center: เรียง items ไปตรงกลางของ container
  • space-between: แสดง items ให้มีพื้นที่คั่นระหว่างกันเท่ากัน
  • space-around: แสดง items ให้มีพื้นที่รอบๆเท่ากัน

ยกตัวอย่างเช่น, justify-content: flex-end; จะย้ายกบไปทางขวา

', + 'mn': '

Бяцхан мэлхий болон түүний найзуудад CSS код бичиж тусалдаг Flexbox Froggy тоглоомонд та тавтай морил! justify-content гэх items-г хэвтээ тэнхлэгийн дагуу байрлуулах пропертийг ашиглан энэ мэлхийг баруун талд байгаа сараана цэцэг рүү хөтөлнө үү, дараах утгуудыг хүлээн авна:

  • flex-start: items-г контейнерын зүүн талд байрлуулна.
  • flex-end: items-г контейнерын баруун талд байрлуулна.
  • center: items-г контейнерын төвд байрлуулна.
  • space-between: items-г хоорондоо нь ижил зайтай байхаар байрлуулна.
  • space-around: items-г эргэн тойрон нь ижил зайтай байхаар байрлуулна.

Жишээлбэл, justify-content: flex-end; нь мэлхийг баруун тийш шилжүүлэх болно.

' + }, + board: 'g', + style: { 'justify-content': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'justify-content 2', + instructions: { + 'en': '

Use justify-content again to help these frogs get to their lilypads. Remember that this CSS property aligns items horizontally and accepts the following values:

  • flex-start: Items align to the left side of the container.
  • flex-end: Items align to the right side of the container.
  • center: Items align at the center of the container.
  • space-between: Items display with equal spacing between them.
  • space-around: Items display with equal spacing around them.
', + 'he': '

השתמשו ב-justify-content שוב כדי לעזור לצפרדעים להגיע לעלים שלהן. זיכרו שתכונת ה-CSS הזו מיישרת את הפריטים בציר האופקי ומקבלת את הערכים הבאים:

  • flex-start: פריטים מיושרים לצד השמאלי של הקונטיינר.
  • flex-end: פריטים מיושרים לצד הימני של הקונטיינר.
  • center: פריטים מיושרים למרכז של הקונטיינר.
  • space-between: פריטים מוצגים עם מרווחים שווים בינהם.
  • space-around: פריטים מוצגים עם מרווחים שווים מסביבם.
', + 'ro': '

Folosește justify-content din nou ca sa ajuți aceste broaște să ajungă pe nuferii lor. Ține minte că această proprietate CSS aliniază elementele orizontal și acceptă următoarele valori:

  • flex-start: Elementele se aliniază pe partea stangă a containerului.
  • flex-end: Elementele se aliniază pe partea dreaptă a containerului.
  • center: Elementele se aliniază pe centrul containerului.
  • space-between: Elementele se afișează cu spațiu egal între ele.
  • space-around: Elementele se afișează cu spațiu egal în jurul lor.
', + 'bg': '

Използвай justify-content отново, за да помогнеш на тези жабчета да достигнат до своите листа. Помни, че това CSS свойство подрежда елементите хоризонтално и приема следните стойности:

  • flex-start: Елементите се подреждат в лявата страна на контейнера.
  • flex-end: Елементите се подреждат в дясната страна на контейнера.
  • center: Елементите се подреждат в средата на контейнера.
  • space-between: Елементите се подреждат с равно разстояние помежду им.
  • space-around: Елементите се подреждат с равно разстояние около тях.
', + 'de': '

Benutze erneut justify-content, um diese Frösche zu ihren Seerosenblättern zu führen. Wie du weißt, richtet diese Eigenschaft die Elemente horizontal aus und akzeptiert die folgenden Werte:

  • flex-start: Elemente an der linken Seite des Containers ausrichten.
  • flex-end: Elemente an der rechten Seite des Containers ausrichten.
  • center: Elemente an der Mitte des Containers ausrichten.
  • space-between: Elemente mit gleichem Innenabstand ausrichten.
  • space-around: Elemente mit gleichem Außenabstand ausrichten.
', + 'pt-br': '

Use justify-content de novo para levar os sapos às suas vitórias-régias. Lembre-se que essa propriedade CSS alinha os itens horizontalmente e aceita os seguintes valores:

  • flex-start: Itens se alinham à esquerda do container.
  • flex-end: Itens se alinham à direita do container.
  • center: Itens se alinham no centro do container.
  • space-between: Itens se alinham com distância igual entre eles.
  • space-around: Itens se alinham com distância igual em torno deles.
', + 'es': '

Nuevamente, utiliza justify-content para ayudar a esas ranas a llegar a sus hojas de lirio. Recuerda que esta propiedad CSS alinea elementos horizontalmente y acepta los siguientes valores:

  • flex-start: Alinea elementos al lado izquierdo del contenedor.
  • flex-end: Alinea elementos al lado derecho del contenedor.
  • center: Alinea elementos en el centro del contenedor.
  • space-between: Muestra elementos con la misma distancia entre ellos.
  • space-around: Muestra elementos con la misma separación alrededor de ellos.
', + 'fr': '

Utilisez encore justify-content pour aider ces grenouilles à se rendre à leurs nénuphars. Souvenez-vous que cette propriété CSS aligne les éléments horizontalement et accepte les valeurs suivantes :

  • flex-start : Les éléments s\'alignent au côté gauche du conteneur.
  • flex-end : Les éléments s\'alignent au côté droit du conteneur.
  • center : Les éléments s\'alignent au centre du conteneur.
  • space-between : Les éléments s\'affichent avec un espace égal entre eux.
  • space-around : Les éléments s\'affichent avec un espacement égal à l\'entour d\'eux.
', + 'ru': '

Используй justify-content ещё раз, чтобы помочь этим лягушатам попасть на их лилии. Помни, что это свойство CSS выравнивает элементы горизонтально и принимает следующие значения:

  • flex-start: элементы выравниваются по левой стороне контейнера.
  • flex-end: элементы выравниваются по правой стороне контейнера.
  • center: элементы выравниваются по центру контейнера.
  • space-between: элементы отображаются с одинаковыми отступами между ними.
  • space-around: элементы отображаются с одинаковыми отступами вокруг них.
', + 'fa': '

با استفاده از خصوصیت justify-content به این قورباغه ها کمک کنید تا روی نیلوفرهای آبی قرار بگیرند. فراموش نکنید که این خاصیت در محور افقی کار میکند.

  • flex-start: آیتم‌ها از ابتدای flex-line ها چیده می‌شوند.
  • flex-end: آیتم‌ها از انتهای flex-line ها چیده می‌شوند.
  • center: آیتم‌ها از وسط flex-line ها چیده می‌شوند.
  • space-between: آیتم اول در ابتدا و آیتم آخر در انتهای flex line قرار می گیرند و بقیه آیتم ها در بین آنها با یک فاصله ی برابر قرار می‌گیرند.
  • space-around: آیتم ها با فضای برابر در کنار یکدیگر قرار می‌گیرند.
', + 'zh-cn': '

再用justify-content一次来帮助这些青蛙到他们的荷叶上。记住这个CSS属性能水平对齐元素，并接受这些参数：

  • flex-start: 元素和容器的左端对齐。
  • flex-end: 元素和容器的右端对齐。
  • center: 元素在容器里居中。
  • space-between:元素之间保持相等的距离。
  • space-around:元素周围保持相等的距离。
    • ', + 'zh-tw': '

    再用justify-content一次來幫助這些青蛙到他們的荷葉上。記住這個CSS屬性能水平對齊元素，並接受這些參數:

    • flex-start: 元素和容器的左端對齊。
    • flex-end: 元素和容器的右端對齊。
    • center: 元素在容器裏居中。
    • space-between: 元素之間保持相等的距離。
    • space-around: 元素周圍保持相等的距離。
      • ', + 'tr': '

      Tekrar justify-content kullanarak bu kurbağaları nilüfer yapraklarının üzerine çıkartın. Bu CSS kuralının öğeleri yatay olarak hizaladığını ve şu değerleri aldığını unutmayın:

      • flex-start: Öğeleri flexbox container\'ın sol tarafına hizalar.
      • flex-end: Öğeleri flexbox container\'ın sağ tarafına hizalar.
      • center: Öğeleri flexbox container\'ın ortasına hizalar.
      • space-between: Öğeler eşit aralıklarla yatay şekilde yayılır
      • space-around: Öğeler etraflarında eşit aralıklar olacak şekilde yatay şekilde yayılır.
      ', + 'az': '

      Təkrar justify-content istifadə edərək bu qurbağaları zanbaq yarpaqlarının üzərinə aparın. Bu CSS qaydasının elementləri üfüqi olaraq nizamlandığı və bu dəyərləri aldığını unutmayın:

      • flex-start: Elementləri flexbox container\'inin sol tərəfinə nizamlayar.
      • flex-end: Elementləri flexbox container\'inin sağ tərəfinə nizamlayar.
      • center: Elementləri flexbox container\'inin ortasına nizamlayar.
      • space-between: Elementlər bərabər aralıqlarda üfüqi şəkildə yayılar
      • space-around: Elementlər ətraflarında bərabər aralıqlarla üfüqi şəkildə yayılar.
      ', + 'it': '

      Usa ancora justify-content per aiutare le rane a raggiungere le ninfee. Ricorda che questa regola CSS allinea gli elementi orizzontalmente e accetta i seguenti valori:

      • flex-start: Allinea gli elementi alla sinistra del loro contenitore.
      • flex-end: Allinea gli elementi alla destra del loro contenitore.
      • center: Allinea gli elementi al centro del loro contenitore.
      • space-between: Separa gli elementi con uguale spazio tra di loro.
      • space-around: Separa gli elementi con uguale spazio attorno a loro.
      ', + 'ko': '

      justify-content를 한 번 더 사용하여 개구리들이 수련잎으로 이동하는 것을 도와주세요. 이 CSS 속성은 요소들을 가로선 상에서 정렬하며 다음의 값들을 인자로 받는다는 것을 기억하세요:

      • flex-start: 요소들을 컨테이너의 왼쪽으로 정렬합니다.
      • flex-end: 요소들을 컨테이너의 오른쪽으로 정렬합니다.
      • center: 요소들을 컨테이너의 가운데로 정렬합니다.
      • space-between: 요소들 사이에 동일한 간격을 둡니다.
      • space-around: 요소들 주위에 동일한 간격을 둡니다.
      ', + 'lt': '

      Panaudokite justify-content dar kartą, kad padėtumėte varlytėms nusigauti ant lelijos lapų. Nepamirškite, kad ši CSS komanda lygiuoja elementus horizontaliai ir reaguoja į šias vertes:

      • flex-start: Elementai lygiuojami supančio elemento kairėje.
      • flex-end: Elementai lygiuojami supančio elemento dešinėje.
      • center: Elementai lygiuojami supančio elemento viduryje.
      • space-between: Elementai atvaizduojami taip, kad tarpai tarp jų būtų vienodi.
      • space-around: Elementai atvaizduojami su vienodais tarpais aplink juos.
      ', + 'vi': '

      Sử dụng justify-content một lần nữa để giúp đỡ những chú ếch này đến các lá bông súng. Hãy nhớ rằng thuộc tính CSS này dùng để sắp xếp các hạng mục theo chiều ngang và chấp nhận các giá trị sau:

      • flex-start: Các hạng mục sẽ được sắp xếp về phía bên trái của hộp chứa.
      • flex-end: Các hạng mục sẽ được sắp xếp về phía bên phải của hộp chứa.
      • center: Các hạng mục sẽ được sắp xếp ở giữa chính của hộp chứa.
      • space-between: Các hạng mục sẽ được trình bày với khoảng cách bằng nhau giữa chúng.
      • space-around: Các hạng mục sẽ được trình bày với khoảng cách bằng nhau xung quanh chúng.
      ', + 'pl': '

      Użyj justify-content ponownie, aby pomóc żabkom dotrzeć do swoich listków. Pamiętaj, że ta właściwość języka CSS wyrównuje elementy w poziomie i przyjmuje wartości:

      • flex-start: Elementy wyrównują się do lewej strony kontenera.
      • flex-end: Elementy wyrównują się do prawej strony kontenera.
      • center: Elementy wyrównują się do środka kontenera.
      • space-between: Elementy wyświetlają się na całej szerokości kontenera z równymi odstępami.
      • space-around: Każdy z elementów wyświetla się z taką samą ilością przestrzeni wokół.
      ', + 'cs': '

      Použijte teď justify-content tak, aby se žabky dostaly na své lekníny. Připomeňte si, že tato CSS vlastnost zarovnává prvky vodorovně a akceptuje následující hodnoty:

      • flex-start: Zarovnat prvky vlevo.
      • flex-end: Zarovnat prvky vpravo.
      • center: Zarovnat prvky na střed.
      • space-between: Rozmístit rovnoměrné mezery mezi prvky.
      • space-around: Rozmístit rovnoměrné mezery kolem prvků.
      ', + 'ja': '

      もう一度justify-contentを使って、カエルたちを蓮の葉まで連れていきましょう。覚えていますか、このCSSプロパティはアイテムを水平に並べるもので、次の値を取ります。

      • flex-start: アイテムはコンテナーの左側に並びます。
      • flex-end: アイテムはコンテナーの右側に並びます。
      • center: アイテムはコンテナーの中央に並びます。
      • space-between: アイテムはその間に等しい間隔を空けて表示されます。
      • space-around: アイテムはその周囲に等しい間隔を空けて表示されます。
      ', + 'hu': '

      Használd ismét a justify-content tulajdonságot, hogy a békákat a tündérrózsáikhoz segíthesd. Ne feledd, hogy ez a CSS tulajdonság az elemeket vízszintesen igazítja és a következő értékeket kaphatja:

      • flex-start: Az elemek a konténer bal oldalára igazodnak .
      • flex-end: Az elemek a konténer jobb oldalára igazodnak.
      • center: Az elemek a konténer közepére igazodnak.
      • space-between: Az elemek úgy igazodnak, hogy köztük a hely egyenlő mértékben oszlik meg.
      • space-around: Az elemek úgy igazodnak, hogy a körülöttük lévő hely egyenlő maradjon.
      ', + 'eo': '

      Uzu justify-content de nove por helpi ĉiujn ranojn atingi iliajn akvolilifoliojn. Memoru ke ĉi tiu CSS-an trajton liniigas horizontale elementojn kaj akceptas la sekvajn valorojn:

      • flex-start: Elementoj linias maldekstraflanken de la ujo.
      • flex-end: Elementoj linias dekstraflanken de la ujo.
      • center: Elementoj linias je la centro de la ujo.
      • space-between: Elementoj afiŝas kun samaj spacoj inter ili.
      • space-around: Elementoj afiŝas kun samaj spacoj ĉirkaŭ ili.
      ', + 'sv': '

      Använd justify-content igen för att hjälpa grodorna till sina blomblad. Kom ihåg att denna CSS-attribut justerar objekten horisontellt och accepterar följande värden:

      • flex-start: Objekt justeras till vänster i containern.
      • flex-end: Objekt justeras till höger i containern.
      • center: Objekt justeras i mitten av containern.
      • space-between: Objekt justeras med lika utrymme mellan varandra.
      • space-around: Objekt justeras med lika utrymme runt omkring varandra.

      Till exempel, justify-content: flex-end; flyttar grodan till höger.

      ', + 'uk': '

      Скористайся justify-content ще раз, та допоможи жабенятам потрапити на свої листи латаття. Памʼятай, що ця CSS-властивість набуває таких значень:

      • flex-start: Елементи вирівнюються по лівій стороні контейнера.
      • flex-end: Елементи вирівнюються по правій стороні контейнера.
      • center: Елементи вирівнюються по центру контейнера.
      • space-between: Елементи буде зображено з рівними відступами поміж них.
      • space-around: Елементи буде зображено з рівними відступами навколо них.
      ', + 'hi': '

      justify-content की सहायता से मेंढकों को पुनः उनके लिली के पत्तों तक पहुंचाइए. याद रखिये की यह CSS प्रॉपर्टी वस्तुओं को छैतिज रूप से संरेखित करती है:

      • flex-start: यह वस्तु को कंटेनर की बाईं तरफ सरेंखित करता है।
      • flex-end: यह वस्तु को कंटेनर की दाईं तरफ सरेंखित करता है।
      • center: यह वस्तु को कंटेनर के मध्य में संरेखित करता है।
      • space-between: यह वस्तुओं को बराबर अंतर के साथ प्रदर्शित करता है।
      • space-around: यह वस्तुओं के चारों ओर के अंतर को प्रदर्शित करता है।
      ', + 'sr': '

      Користи опет justify-content да би помогао/ла жабицама да стигну до својих локвања. Присети се да ово CSS својство поравњава елементе хоризонтално и прихвата следеће вредности:

      • flex-start: Елементе поравњава на леву страну контејнера.
      • flex-end: Елементе поравњава на десну страну контејнера.
      • center: Елементе поставља у центар контејнера.
      • space-between: Елементе приказује са једнаким растојањем између елемената.
      • space-around: Елементе приказује са једнаким растојањем око елемената.
      ', + 'bs': '

      Koristi opet justify-content da bi pomogao/la žabicama da stignu do svojih listova. Prisjeti se da ovo CSS svojstvo poravnava elemente horizontalno i prihvata sljedeće vrijednosti:

      • flex-start: Elemente poravnava na lijevu stranu kontejnera.
      • flex-end: Elemente poravnava na desnu stranu kontejnera.
      • center: Elemente postavlja u centar kontejnera.
      • space-between: Elemente prikazuje sa jednakim rastojanjem između elemenata.
      • space-around: Elemente prikazuje sa jednakim rastojanjem oko elemenata.
      ', + 'hr': '

      Opet koristi justify-content da bi pomogao/la žabicama da stignu do svojih listova. Prisjeti se da ovo CSS svojstvo poravnava elemente horizontalno i prihvaća sljedeće vrijednosti:

      • flex-start: Elemente poravnava na lijevu stranu kontejnera.
      • flex-end: Elemente poravnava na desnu stranu kontejnera.
      • center: Elemente postavlja u centar kontejnera.
      • space-between: Elemente prikazuje sa jednakim razmakom između elemenata.
      • space-around: Elemente prikazuje sa jednakim razmakom oko elemenata.
      ', + 'nl': '

      Maak nogmaals gebruik van justify-content om de kikkers naar hun lelieblaadjes te helpen. Vergeet niet dat deze CSS eigenschap elementen horizontaal uitlijnt en de volgende waarden kan ontvangen:

      • flex-start: Elementen aan de linkerkant van de container uitlijnen.
      • flex-end: Elementen aan de rechterkant van de container uitlijnen.
      • center: Elementen in het midden van de container uitlijnen.
      • space-between: Elementen worden gedistribueerd over de volledige dimensie en krijgen een gelijke spatiëring tussen hun.
      • space-around: Elementen worden gedistribueerd over de volledige dimensie en krijgen een gelijke spatiëring rondom hun.
      ', + 'ta': '

      மீண்டும் justify-content பயன்படுத்தி, தவளை அதற்கான இலையினை அடைய உதவவும். இந்த CSS property கிடைமட்டமாக பொருட்களை சீரமைக்கும் மற்றும் பின்வரும் மதிப்புகளை ஏற்றுக்கொள்ளும் என்பதை நினைவில் கொள்ளவும்.

      • flex-start: Items வலது பக்கமாக ஒதுக்கப்படும்.
      • flex-end: Items இடது பக்கமாக ஒதுக்கப்படும்.
      • center: Items மையப்பகுதியில் பக்கமாக ஒதுக்கப்படும்.
      • space-between: Items இடைவெளியில் சமமான இடைவெளி விடப்படும்.
      • space-around: Items சுற்றி சமமான இடைவெளி விடப்படும்.
      ', + 'te': '

      ఈ కప్పలు వారి లిల్లీప్యాడ్‌లను పొందడానికి సహాయపడటానికి justify-contentను మళ్ళీ ఉపయోగించండి. ఈ CSS వస్తువుల అంశాలను అడ్డంగా సమలేఖనం చేస్తుందని మరియు ఈ క్రింది విలువలను అంగీకరిస్తుందని గుర్తుంచుకోండి:

      • flex-start: వస్తువులు కంటైనర్ యొక్క ఎడమ వైపుకు సమలేఖనం చేయబడతాయి.
      • flex-end: వస్తువులు కంటైనర్ యొక్క కుడి వైపున సమలేఖనం చేయబడతాయి.
      • center: వస్తువులు కంటైనర్ మధ్యలో సమలేఖనం చేయబడతాయి.
      • space-between: వస్తువులు వాటి మధ్య సమాన అంతరాలతో ప్రదర్శించబడతాయి.
      ', + 'ml': '

      justify-content ഉപയോഗിച്ച് തവളകളെ തിരിച്ചു താമര ഇലകളിലേക്കു എത്തിക്കുക. തിരശ്ചീനമായി ആണ് ഈ പ്രോപ്പർട്ടി വിന്യസിക്കുന്നത് എന്ന് ഓർക്കുക

      • flex-start: ഇനങ്ങൾ കണ്ടെയ്നറിന്റെ ഇടതുവശത്തേക്ക് വിന്യസിക്കുക.
      • flex-end: ഇനങ്ങൾ കണ്ടെയ്നറിന്റെ വലതുവശത്തേക്ക് വിന്യസിക്കുക.
      • center: ഇനങ്ങളുടെ മധ്യഭാഗത്ത് ഇനങ്ങൾ വിന്യസിക്കുക.
      • space-between: ഇനങ്ങൾ തമ്മിൽ തുല്യ ഇടവേളയിൽ പ്രദർശിപ്പിക്കും.
      • space-around: ഇനങ്ങൾ അവയ്ക്ക് തുല്യമായ സ്പെയ്സിംഗ് ഉപയോഗിച്ച് കാണാം.
      ', + 'el': '

      Χρησιμοποιήστε ξανά το justify-content για να βοηθήσετε αυτούς τους βατράχους να φτάσουν στα νούφαρά τους. Θυμηθείτε ότι η ιδιότητα CSS ευθυγραμμίζει αντικείμενα στον οριζόντιο άξονα και αποδέχεται τις εξής αξίες:

      • flex-start: Τα αντικείμενα ευθυγραμμίζονται στην αριστερή πλευρά του container.
      • flex-end: Τα αντικείμενα ευθυγραμμίζονται στην δεξιά πλευρά του container.
      • center: Τα αντικείμενα ευθυγραμμίζονται στο κέντρο του container.
      • space-between: Τα αντικείμενα εμφανίζονται με ίσο διάστημα ανάμεσά τους.
      • space-around: Τα αντικείμενα εμφανίζονται με ίσο διάστημα γύρω τους.
      ', + 'mk': '

      Користете justify-content повторно за да им помогнете на овие жаби да стигнат до своите листови. Запомнете дека ова CSS својство подредува елементи хоризонтално и ги прима следните вредности:

      • flex-start: Елементите се подредуваат по левата страна на контејнерот.
      • flex-end: Елементите се подредуваат по десната страна на контејнерот.
      • center: Елементите се подредуваат во средината на контејнерот.
      • space-between: Елементите се подредуваат со еднакво растојание помеѓу нив.
      • space-around: Елементите се подредуваат со еднакво растојание околу нив.
      ', + 'lv': '

      Vēlreiz lieto justify-content un palīdzi vardulēniem nokļūt līdz ūdensrozēm. Atceries, ka šī CSS metode elementus novieto horizontāli un pieņem sekojošas vērtības:

      • flex-start: Novieto elementu kreisajā konteinera pusē.
      • flex-end: Novieto elementu labajā konteinera pusē.
      • center: Novieto elementu konteinera vidū.
      • space-between: Elementi tiek novietoti ar vienādu atstarpi starp tiem.
      • space-around: Elementi tiek novietoti ar vienādu apkārtesošo laukumu.
      ', + 'id': '

      Gunakan justify-content lagi untuk membantu katak ini ke lilypad. Ingat bahwa properti CSS ini menyejajarkan item secara horizontal dan menerima nilai-nilai berikut:

      • flex-start: Objek sejajar dengan sisi kiri wadah.
      • flex-end: Objek sejajar dengan sisi kanan wadah.
      • center: Objek sejajar di tengah wadah.
      • space-between: Objek ditampilkan dengan jarak yang sama di antara mereka.
      • space-around: Objek ditampilkan dengan jarak yang sama di sekitarnya.
      ', + 'ar': '

      استخدم justify-content لمساعدة الضفادع للعودة الى اوراق الزنبق الخاصة بها. تذكر ان خاصية الـCSS هذه تحاذي العناصر افقيا و تقبل هذه القيم:

      • flex-start: محاذاة العناصر الى الجانب الأيسر من الحاوية.
      • flex-end: محاذاة العناصر الى الجانب الايمن من الحاوية.
      • center: محاذاة العناصر الى وسط الحاوية.
      • space-between: عرض العناصر بتباعد متساوٍ بينهم.
      • space-around: عرض العناصر بتباعد متساوٍ بينهم.
      ', + 'ca': '

      Novament, utilitza justify-content per ajudar a les granotes a arribar als seus nenúfars. Recorda que aquesta propietat CSS alinea elements horitzontalment i accepta els següents valors:

      • flex-start: Alinea elements al costat esquerra del contenidor.
      • flex-end: Alinea elements al costat dret del contenidor.
      • center: Alinea elements al centre del contenidor.
      • space-between: Mostra elements amb la mateixa distància entre ells.
      • space-around: Mostra elements amb la mateixa separació al seu voltant.
      ', + 'da': '

      Brug justify-content igen for at hjælpe disse frøer hen til deres åkander. Husk at denne CSS-egenskab justerer elementer vandret og kan tage følgende værdier:

      • flex-start: Elementer justeres til venstre side af beholderen.
      • flex-end: Elementer justeres til højre side af beholderen.
      • center: Elementer justeres til midten af beholderen.
      • space-between: Elementer vises med fast afstand imellem sig.
      • space-around: Elementer vises med fast afstand omkring sig.
      ', + 'et': '

      Kasuta taaskord justify-content, et aidata konnad oma lehtedele. Pea silmas, et see CSS omadus joondab elemendid horisontaalselt ja kasutab järgmisi väärtusi:

      • flex-start: Elemendid joonduvad kontineri vasakule poole.
      • flex-end: Elemendid joonduvad kontineri paremale poole.
      • center: Elemendid joonduvad konteineri keskele.
      • space-between: Elementide vahele tekib iga kord sama suur vahe.
      • space-around: Elementide ümber tekib iga kord sama suur vahe.
      ', + 'fi': '

      Käytä taas ominaisuutta justify-content, jotta nämä sammakot pääsevät omien lumpeenlehtiensä luo. Muista, että tämä CSS-ominaisuus kohdistaa elementit vaakasuunnassa ja sille voi antaa jonkin seuraavista arvoista:

      • flex-start: Elementit kohdistetaan säilön vasempaan reunaan.
      • flex-end: Elementit kohdistetaan säilön oikeaan reunaan.
      • center: Elementit kohdistetaan vaakasuunnassa säilön keskelle.
      • space-between: Elementtien välissä on yhtä paljon tilaa.
      • space-around: Elementtien ympärillä on yhtä paljon tilaa.
      ', + 'gl': '

      Volve usar justify-content para axudar ás rás a chegar a cadanseu nenúfar. Recorda que esta propiedade CSS aliña os elementos horizontalmente e acepta os seguintes valores:

      • flex-start: Os elementos alíñanse no lado esquerdo do contedor.
      • flex-end: Os elementos alíñanse no lado dereito do contedor.
      • center: Os elementos alíñanse no centro do contedor.
      • space-between: Os elementos distribúense co mesmo espazo entre eles.
      • space-around: Os elementos distribúense co mesmo espazo darredor deles.
      ', + 'th': '

      ใช้ justify-content อีกครั้งเพื่อช่วยเจ้ากบเหล่านี้ให้ไปที่ใบบัว จำไว้ว่าคุณสมบัติ CSS นี้จัดเรียง items ตามแนวนอน และรับค่าเหล่านี้ได้:

      • flex-start: เรียง items ไปทางซ้ายของ container
      • flex-end: เรียง items ไปทางขวาของ container.
      • center: เรียง items ไปตรงกลางของ container
      • space-between: แสดง items ให้มีพื้นที่คั่นระหว่างกันเท่ากัน
      • space-around: แสดง items ให้มีพื้นที่รอบๆเท่ากัน
      ', + 'mn': '

      Эдгээр мэлхийнүүдийг сараана цэцэг рүүгээ очиход нь туслахын тулд justify-content-г дахин ашиглаарай. Энэ CSS проперти нь items-г хэвтээ тэнхлэгийн дагуу байрлуулах ба дараах утгуудыг хүлээн зөвшөөрдөг гэдгийг санаарай:

      • flex-start: items-г контейнерын зүүн талд байрлуулна.
      • flex-end: items-г контейнерын баруун талд байрлуулна.
      • center: items-г контейнерын төвд байрлуулна.
      • space-between: items-г хоорондоо нь ижил зайтай байхаар байрлуулна.
      • space-around: items-г эргэн тойрон нь ижил зайтай байхаар байрлуулна.
      ' + }, + board: 'gy', + style: { 'justify-content': 'center' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'justify-content 3', + instructions: { + 'en': '

      Help all three frogs find their lilypads just by using justify-content. This time, the lilypads have lots of space all around them.

      If you find yourself forgetting the possible values for a property, you can click on the property name to view them. Try clicking on justify-content.

      ', + 'he': '

      עזרו לכל הצפרדעים להגיע לעלים שלהן רק בעזרת justify-content. הפעם יש הרבה מרווח מסביב לעלים.

      אם שכחתם איזה ערכים התכונה יכולה לקבל, תעברו על התכונה עם העכבר כדי לראות אותם. נסו לשים את העבר על justify-content.

      ', + 'ro': '

      Ajută-le pe cele trei broaște să-și găsească nuferii folosind doar justify-content. De această dată, nuferii au foarte mult spațiu între ei.

      Dacă nu-ți mai amintești posibilele valori ale unei proprietăți, poți să faci hover peste numele unei proprietăți pentru a le vedea. Incearcă să faci hover pe justify-content.

      ', + 'bg': '

      Помогни на трите жабчета да намерят своите листа, използвайки justify-content. Този път листата имат доста място около себе си.

      Ако забравиш някоя от възможните стойности на дадено свойство, можеш да посочиш с мишката върху името на свойството, за да ги видиш. Опитай да посочиш върху justify-content.

      ', + 'de': '

      Hilf den drei Fröschen, ihre Seerosenblätter zu finden, indem du justify-content verwendest. Dieses Mal haben die Seerosenblätter einen großen Außenabstand.

      Falls du die möglichen Werte einer Eigenschaft vergessen haben solltest, kannst du den Mauszeiger über den Namen einer Eigenschaft bewegen. Versuche es bei justify-content.

      ', + 'pt-br': '

      Ajude todos os três sapos a encontrar suas vitórias-régias usando justify-content. Desta vez, as vitórias-régias têm muito espaço em torno delas.

      Caso você esqueça os possíveis valores de uma propriedade, passe o cursor sobre a propriedade para visualizá-los. Tente passar o cursor sobre justify-content.

      ', + 'es': '

      Ayuda a las tres ranas a encontrar sus hojas de lirio usando justify-content. En esta oportunidad, las hojas de lirio tienen mucho espacio a su alrededor.

      Si no recuerdas los valores de una propiedad, puedes pasar el cursor sobre el nombre de una e inmediatamente se mostrarán. Prueba pasando el cursor sobre justify-content.

      ', + 'fr': '

      Aidez les trois grenouilles à trouver leurs nénuphars en utilisant seulement justify-content. Cette fois-ci, les nénuphars ont beaucoup d\'espace tout autour d\'eux.

      Si vous oubliez les valeurs possibles pour une propriété, vous pouvez survoler le nom de cette propriété pour les voir. Essayez de survoler justify-content.

      ', + 'ru': '

      Помоги всем трём лягушатам найти их лилии, просто используя justify-content. В этот раз у лилий много пространства вокруг.

      Если ты чувствуешь, что забыл возможные значения свойства, ты можешь навести курсор на название свойства, чтобы посмотреть их. Попробуй навести курсор на justify-content.

      ', + 'fa': '

      با استفاده از justify-content به این سه قورباغه کمک کنید تا نیلوفرهای آبی خود را پیدا کنند. حواستون به این نکته باشه که نیلوفرهای آبی با فاصبه برابر کنار هم قرار گرفتند.

      اگر مقادیر این خاصیت را فراموش کردید, میتونید با قرار دادن ماوس روی خاصیت مقادیر را ببینید. justify-content.

      ', + 'zh-cn': '

      仅靠justify-content来帮助全部三只青蛙找到他们的荷叶。这次荷叶周边都有很多的空地。

      如果你忘了一个CSS属性可选的值的话，你可以将鼠标移到参数名上面来查看。试试将鼠标移到justify-content。

      ', + 'zh-tw': '

      僅靠justify-content來幫助全部三隻青蛙找到他們的荷葉。這次荷葉周邊都有很多的空地。

      如果你忘了一個CSS屬性可選的值的話，你可以將鼠標移到參數名上面來查看。試試將鼠標移到justify-content。

      ', + 'tr': '

      justify-content kuralını kullanarak üç kurbağanın da kendi nilüfer yaprağını bulmasını sağlayın. Bu sefer, nilüfer yaprakları etrafında bolca boş alan var.

      Olur da bir kuralın alabileceği değerleri unutursanız, o kuralın üzerine farenizi götürerek değerlerini görebilirsiniz. Farenizi justify-content üzerine götürmeyi deneyin.

      ', + 'az': '

      justify-content qaydasını istifadə edərək üç qurbağanın da öz zanbaq yarpağını tapmaqlarını kömək edin. Bu səfər, zanbaq yarpaqları ətrafında çoxlu boş sahə var.

      Əgər bir qaydanın alacağı dəyərləri unutsanız, o qaydanın üzərinə siçanı götürərək dəyərləri görəbilərsiniz. Siçanı justify-content üzərinə götürməyi yoxlayın.

      ', + 'it': '

      Aiuta le tre rane a raggiungere le ninfee usando la proprietà justify-content. Fai attenzione, questa volta le ninfee hanno molto spazio attorno a loro.

      Se hai dimenticato alcuni valori per le proprietà CSS, puoi portare il mouse sopra il nome della proprietà per visualizzare tutti i valori disponibili. Prova a portare il cursore sopra justify-content.

      ', + 'ko': '

      justify-content를 사용하여 세마리의 개구리가 모두 수련잎으로 이동할 수 있도록 도와주세요. 이번에는 수련잎 주위에 많은 간격이 있습니다.

      만약 이 속성에서 사용 가능한 인자들이 기억나지 않는다면, 포인터를 속성 이름 위로 이동시키세요. justify-content 위로 포인터를 이동시켜 보세요.

      ', + 'lt': '

      Padėkite visoms trims varlytėms pasiekti savo lelijos lapus naudodami justify-content. Šį kartą aplink lelijos lapus yra labai daug vietos.

      Jei netikėtai pamiršote galimas šios komandos vertes, jas prisiminti galite užvedę žymeklį ant komandos pavadinimo. Pabandykite užvesti žymeklį ant justify-content.

      ', + 'vi': '

      Giúp tất cả ba chú ếch tìm những lá bông súng của họ bằng cách sử dụng justify-content. Lần này, những lá bông súng có rất nhiều không gian xung quanh chúng.

      Nếu bạn thấy mình đang quên đi những giá trị cho thuộc tính này, bạn có thể di chuột qua từ đó để xem chúng. Hãy thử di chuột qua từ nàyjustify-content.

      ', + 'pl': '

      Pomóż wszystkim żabkom dotrzeć do ich listków przy pomocy tylko właściwości justify-content. Tym razem, listki mają dużo miejsca wokół.

      Jeśli nie pamiętasz jakie wartości przyjmuje ta właściwość możesz najechać myszką na jej nazwę, aby je zobaczyć. Spróbuj przesunąć myszkę nad justify-content.

      ', + 'cs': '

      Pomozte těmto třem žabkám na jejich lekníny vlastností justify-content. Tentokrát je mezi lekníny hodně místa.

      Pokud zapomenete, jaké hodnoty lze pro kterou vlastnost použít, najeďte na ni myší. Zkuste najet na justify-content.

      ', + 'ja': '

      justify-contentだけを使って三匹のカエルを全て蓮の葉に乗せてあげましょう。この蓮の葉は、それぞれの周囲にたくさんの隙間が空いています。

      プロパティーが取り得る値を忘れてしまったら、プロパティー名にマウスカーソルを乗せると、それを見ることができます。試しにマウスカーソルをjustify-contentに乗せてみてください。

      ', + 'hu': '

      Segíts mindhárom békának megtalálni a saját tündérrózsáját pusztán a justify-content használatával. Ezúttal a tündérrózsák körül meglehetősen sok hely van.

      Ha úgy érzed, elfelejtetted a lehetséges értékeket ehhez a tulajdonsághoz, vidd az egérkurzort a tulajdonság neve fölé, hogy láthasd őket. Próbáld ki a justify-content-en.

      ', + 'eo': '

      Helpu ĉi tiujn tri ranojn trovi iliajn nimfeofoliojn nur pere de justify-content. Ĉifoje, la nimfeofolioj havas multe da spaco ĉirkaŭ ili.

      Se vi forgesas la eblan valoron por trajton, vi povas ŝvebi sur la nomon de la trajto por afiŝi ilin. Provu ŝvebi sur justify-content.

      ', + 'sv': '

      Hjälp alla tre grodorna tillbaka till sina blombald genom att använda justify-content. Denna gången har blombladen mycket utrymme runt omkring varandra.

      Om du glömmer bort de accepterade värdena för en attribut kan du föra musen över dem för att se dem. Testa att föra musen över justify-content.

      ', + 'uk': '

      Допоможи трьом жабенятам опинитися на своїх листах латаття, використовуючи justify-content. Але цього разу між листками є багато простору.

      Якщо ти забув можливі значення властивості, ти можеш навести на назву властивості для підказки. Спробуй навести на justify-content.

      ', + 'hi': '

      तीनों मेंढकों को justify-content की मदद से उनके लिली के पत्तों तक पहुंचाइए। इस समय लिली के पत्तों के चारों ओर काफी जगह मोजूद है।

      अगर आप किसी प्रॉपर्टी का महत्व भूल रहें हैं तो आप उस प्रॉपर्टी के उपर होवर करते हुए उसका महत्व जान सकते हैं।justify-content के उपर होवर करने की कोशिश कीजिये।

      ', + 'sr': '

      Помози да све три жабице нађу своје локвање користећи само justify-content. Овог пута локвањи имају много простора око себе.

      Ако си заборавио/ла могуће вредности за својство, можеш прећи курсором преко назива својства да би их видео. Пробај да пређеш курсором преко justify-content.

      ', + 'bs': '

      Pomozi da sve tri žabice nađu svoje listove koristeći samo justify-content. Ovog puta listovi imaju mnogo prostora oko sebe.

      Ako si zaboravio/la moguće vrijednosti za svojstvo, možeš preći kursorom preko naziva svojstva da bi ih video. Probaj da pređeš kursorom preko justify-content.

      ', + 'hr': '

      Pomozi da sve tri žabice nađu svoje listove koristeći samo justify-content. Ovog puta listovi imaju mnogo prostora oko sebe.

      Ako si zaboravio/la moguće vrijednosti za svojstvo, možeš prijeći kursorom preko naziva svojstva da bi ih vidio. Probaj prijeći kursorom preko justify-content.

      ', + 'nl': '

      Help alle drie kikkers naar hun lelieblaadjes door gebruik te maken van justify-content. Deze keer is er veel plaats rond de lelieblaadjes.

      Indien je de mogelijke waarden vergeten bent kun je altijd je cursor over de naam van de eigenschap houden. Probeer je cursor over justify-content te houden.

      ', + 'ta': '

      justify-content பயன்படுத்தி, தவளை அதற்கான இலையினை அடைய உதவவும். இந்த முறை இலையினை சுற்றி நிறைய வெற்றிடம் இருக்கின்றது.

      நீங்கள் ஒரு வேளை சாத்தியமான மதிப்புகளை மறந்து இருந்தால், பண்பின் பெயர் மீது hover செய்தால் அதன் மதிப்புகளை பார்க்கலாம். இப்போது justify-content மீது hover செய்து முயற்சிக்கவும்.

      ', + 'te': '

      మూడు కప్పల కోసంjustify-contentను ఉపయోగించడం ద్వారా వారి లిల్లీప్యాడ్లను కనుగొనడంలో సహాయపడండి. ఈ సమయంలో, లిల్లీప్యాడ్‌లు వాటి చుట్టూ చాలా స్థలాన్ని కలిగి ఉన్నాయి.

      దీనికి సాధ్యమయ్యే విలువలను మీరు మరచిపోతున్నట్లు అనిపిస్తే, మీరు వాటిని చూడటానికి అంశాల పేరు మీద హోవర్ చేయవచ్చు. ఒక సారి మౌస్ పాయింటర్ ని justify-content మీద ఉంచి ప్రయత్నించండి.

      ', + 'ml': '

      justify-content ഉപയോഗിച്ച് തവളകളെ താമര ഇലകൾ കണ്ടുപിടിക്കാൻ സഹായിക്കുക . ഈ സമയം, lilypads അവരുടെ ചുറ്റും ധാരാളം സ്ഥലം ഉണ്ട്.

      ഒരു വസ്തുവിന്റെ മൂല്യങ്ങൾ നിങ്ങൾ മറന്നുപോകുന്നതായി കണ്ടാൽ, അവ കാണുന്നതിന് നിങ്ങൾക്ക് പ്രോപ്പർട്ടിയുടെ പേരിൽ ഹോവർ ചെയ്യാം. justify-content.

      ഹോവർ ചെയ്യൽ ശ്രമിക്കുക', + 'el': '

      Βοηθήστε και τους τρεις βατράχους να βρουν τα νούφαρά τους χρησιμοποιώντας μόνο το justify-content. Αυτή την φορά, τα νούφαρα έχουν άπλετο διάστημα τριγύρω τους.

      Αν ξεχάσετε τις πιθανές αξίες για μια ιδιότητα, μπορείτε να βάλετε το ποντίκι σας πάνω από το όνομα της ιδιότητας για να τις δείτε. Δοκιμάστε να βάλετε το ποντίκι σας πάνω από το justify-content.

      ', + 'mk': '

      Помогнете им на сите три жаби да ги најдат своите листови само со користење на justify-content. Овој пат, листовите имаат многу простор околу нив.

      Доколку ги заборавите можните вредности за некое својство, можете да лебдите со маусот преку името на својството за да ги видите. Пробајте да лебдите со маусот преку justify-content.

      ', + 'lv': '

      Lieto justify-content un palīdzi visiem trīs vardulēniem nokļūt līdz ūdensrozēm. Šoreiz ap ūdensrozēm ir plašs apkārtesošais laukums.

      Ja gadījumā piemirstas visas iespējamās vērtības, tad vari ar peli uzbraukt uz metodes nosaukuma un apskatīt tās. Pamēģini ar peli uzbraukt uz justify-content.

      ', + 'id': '

      Bantu semua tiga katak menemukan lilypads dengan gunakan justify-content. Kali in i, lilypads mempunyai jarak lebih diantara mereka

      Jika kamu lupa value untuk properti, kamu dapat mengarahkan kursor ke nama properti untuk melihatnya. Cobalah ambangkan pointer kamu justify-content.

      ', + 'ar': '

      ساعد الضفادع الثلاثة بالعودة الى اوراق الزنبق فقط باستخدام justify-content. هذه المرة, يوجد بين اوراق الزنبق فراغات كثيرة.

      اذا كنت قد نسيت القيم الممكنة للخاصية, يمكنك المرور فوقها بالمؤشر لرؤيتها. جرب المرور فوق justify-content.

      ', + 'ca': '

      Ajuda a les tres granotes a trobar els seus nenúfars utilitzant justify-content. Aquest cop, els nenúfars tenen molt espai aal seu voltant.

      Si no recordes els valors d\'una propietat, pots passar el cursor sobre el nom d\'una i inmediatament es mostrarà. Prova a passar el cursor sobre justify-content.

      ', + 'da': '

      Hjælp alle tre frøer hen til deres åkander kun ved at bruge justify-content. Denne gang er der masser af plads rundt om åkanderne.

      Hvis du ikke kan huske hvilke værdier en egenskab kan tage, kan du holde musen over egenskabens navn for at se dem. Prøv at holde musen over justify-content.

      ', + 'et': '

      Aita kõik kolm konna oma lehtedele kasutades justify-content. Seekord, on vesiroosilehtede vahel palju rohkem ruumi.

      Kui sul on meelest läinud omaduste võimalikud väärtused, siis võid hoida kursorit nende kohal. Proovi hoide kursorit selle omaduse kohal: justify-content.

      ', + 'fi': '

      Auta näitä kolmea sammakkoa löytämään omat lumpeenlehtensä pelkän justify-content-ominaisuuden avulla. Tällä kertaa lumpeenlehtien ympärillä on paljon tilaa.

      Jos et muista jonkin ominaisuuden mahdollisia arvoja, osoita ominaisuuden nimeä. Kokeile osoittaa ominaisuutta justify-content.

      ', + 'gl': '

      Axuda ás tres rás a atopar cadanseu nenúfar empregando só justify-content. Desta vez, os nenúfares teñen moito espazo darredor.

      Se non lembras cales son os posibles valores dunha propiedade, podes pasar o cursor por riba do nome da propiedade para velos. Proba a pasar o cursor por riba de justify-content.

      ', + 'th': '

      ช่วยเจ้ากบทั้งสามตัวให้ไปหาใบบัวโดยใช้เพียงคำสั่ง justify-content ในครั้งนี้ ใบบัวมีช่องว่างรอบๆใบค่อนข้างมาก

      ถ้าคุณพบว่าตัวเองลืมค่าต่างๆของคุณสมบัตินี้, คุณสามารถคลิกที่ชื่อคุณสมบัติเพื่อดูได้ ลองคลิกที่ justify-content ดูสิ

      ', + 'mn': '

      Гурван мэлхийд зөвхөн justify-content ашиглан сараана цэцэгээ олоход нь туслаарай. Энэ удаад сараана цэцэгсийн эргэн тойронд их зайтай байна.

      Хэрэв ямар нэг пропертигийн авч болох утгыг санахгүй байвал тухайн пропертигийн нэр дээр дарж үзэх боломжтой. justify-content Дарж үзнэ үү.

      ' + }, + board: 'gyr', + style: { 'justify-content': 'space-around' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'justify-content 4', + instructions: { + 'en': '

      Now the lilypads on the edges have drifted to the shore, increasing the space between them. Use justify-content. This time, the lilypads have equal spacing between them.

      ', + 'he': '

      עכשיו העלים בקצוות נסחפו אל החוף והרווח בינהם גדל. תשתמשו ב-justify-content. הפעם יש לעלים מרווחים שווים בינהם.

      ', + 'ro': '

      Acum nuferii din margini au plutit in derivă la țârm, mărind spațiul dintre ei. Folosește justify-content. De această dată, nuferii au spațiu egal între ei.

      ', + 'bg': '

      Сега крайните листа се носят към брега, увеличавайки разстоянието между тях . Използвай justify-content. Този път листата имат еднакво разстояние помежду си.

      ', + 'de': '

      Inzwischen sind die äußeren Seerosenblätter weiter nach außen getrieben und haben so den Abstand noch weiter vergrößert. Benutze justify-content. Dieses Mal haben die Seerosenblätter einen gleichmäßigen Innenabstand.

      ', + 'pt-br': '

      Agora as vitórias-régias nos cantos desviaram-se para a costa, aumentando o espaço em torno delas. Use justify-content. Desta vez, as vitórias-régias têm espaço igual entre elas.

      ', + 'es': '

      Ahora las hojas de lirio de los bordes se han desplazado a un costado, aumentando así el espacio entre ellas. Usa justify-content. En esta oportunidad, las hojas de lirio tienen el mismo espacio entre ellas.

      ', + 'fr': '

      Maintenant, les nénuphars sur les côtés ont dérivé jusqu\'à la rive, augmentant l\'espace entre eux. Utilisez justify-content. Cette fois-ci, l\'espace entre chaque nénuphar est équivalent.

      ', + 'ru': '

      Теперь лилии по краям уплыли к берегам, увеличив пространство между ними. Используй justify-content. В этот раз у лилий одинаковое расстояние между ними.

      ', + 'fa': '

      در حال حاضر نیلوفر های آبی به سمت لبه های ساحل حرکت کرده اند و فضای بین آنها افزایش پیدا کرده پس با استفاده از justify-content به قورباغه ها کمک کنید. نیلوفرهای آبی دارای فاصله مساوی هستن.

      ', + 'zh-cn': '

      现在边上的荷叶都漂到了岸上，使得他们之间的间距变大了。使用justify-content。这次荷叶之间有相等的距离。

      ', + 'zh-tw': '

      現在邊上的荷葉都漂到了岸上，使得他們之間的間距變大了。使用justify-content。這次荷葉之間有相等的距離。

      ', + 'tr': '

      Şimdi de nilüfer yaprakları sürüklenerek kıyıya vurmuşlar. justify-content kuralını kullanın ve nilüfer yaprakları arasındaki mesafenin eşit olduğuna dikkat edin.

      ', + 'az': '

      İndi kənarlardakı zanbaqlar sahilə sürüklənərək, aralarındakı boşluğu artırdı. justify-content qaydasını istifadə edin və zanbaq yarpaqları arasındakı məsafənin bərabər olduğuna diqqət edin.

      ', + 'it': '

      Le ninfee sono andate alla deriva aumentando lo spazio tra di loro. Usa justify-content. Questa volta le ninfee sono equidistanti tra di loro.

      ', + 'ko': '

      수련잎이 연못가로 떠내려가면서 수련잎 사이의 간격이 넓어졌습니다. justify-content를 사용하세요. 이번에는 수련잎 사이에 동일한 간격이 있습니다.

      ', + 'lt': '

      Dabar kraštiniai lelijos lapai nuplaukė arčiau krantų, taip padidindami tarpus tarp vienas kito. Naudokite justify-content. Šį kartą tarpai tarp lelijos lapų yra vienodi.

      ', + 'vi': '

      Bây giờ những lá bông súng đã trôi dạt vào bờ, tạo thêm không gian giữa chúng. Sử dụng justify-content. Lần này, những lá bông súng có khoảng cách bằng nhau giữa chúng.

      ', + 'pl': '

      Tym razem skrajne listki odpłynęły do krańców kontenera, zwiększając odstępy. Użyj justify-content. Tym razem listki mają tę samą odległość między sobą.

      ', + 'cs': '

      Teď lekníny na stranách odpluly ke břehu, zvětšíly se mezery. Použijte justify-content. Tentokrát jsou mezi lekníny rovnoměrné rozestupy.

      ', + 'ja': '

      蓮の葉は両岸まで流されてしまいました。間隔はさらに開いています。justify-contentを使いましょう。蓮の葉は等間隔に並んでいます。

      ', + 'hu': '

      Mostanra a tündérrózsák kisodródtak a tópart felé, megnövelve ezáltal a közöttük tátongó űrt. Használd a justify-content tulajdonságot. Ezúttal a tündérrózsák között egyenlő mértékű szabad terület van.

      ', + 'eo': '

      Nun, la flankaj akvolilifolioj flosas al la bordo, grandigante la spacon inter ili. Uzu justify-content. Ĉifoje, la akvolilifolioj havas saman spacon inter ili.

      ', + 'sv': '

      Nu har blombladen längs med kanterna drivit in till stranden och utökt utrymmet mellan dem. Använd justify-content. Denna gång är blombladen jämt fördelade.

      ', + 'uk': '

      Тепер крайні листя латаття віднесло до берегів, збільшуючи простір між ними. Використовуй justify-content. Цього разу поміж листками латаття рівні відстані.

      ', + 'hi': '

      अब लिली के पत्ते किनारों की तरफ चले गयें हैं। justify-contentका इस्तेमाल कीजिये। इस समय लिली के पत्तों के मध्य बराबर जगह है।

      ', + 'sr': '

      Сада су крајњи локвањи померени према обали што увећава растојање између њих. Користи justify-content. Овог пута размак између локвања је идентичан.

      ', + 'bs': '

      Sada su krajnji listovi pomjereni prema obali što uvećava rastojanje između njih. Koristi justify-content. Ovog puta razmak između listova je identičan.

      ', + 'hr': '

      Sada su krajnji listovi pomaknuti prema obali što uvećava razmak između njih. Koristi justify-content. Ovog je puta razmak između listova identičan.

      ', + 'nl': '

      De lelieblaadjes aan de rand zijn naar de oever van de vijver gedreven, waardoor de plaats tussen hun groter is geworden. Maak gebruik van justify-content. Deze keer is er een gelijke verdeling van plaats tussen hun.

      ', + 'ta': '

      இப்பொழுது இலைகள் தங்களுக்கு இடையில் அதிக இடைவெளி விட்டு குளத்தின் கரை ஒற்றி சென்றுவிட்டன. மீண்டும் code>justify-content உபயோகித்து முயற்சிக்கவும்.

      ', + 'te': '

      ఇప్పుడు అంచులలోని ఉన్న లిల్లీప్యాడ్‌లు ఒడ్డుకు మళ్ళి, వాటి మధ్య ఖాళీని పెంచుతున్నాయి. justify-content ని ఉపయోగించండి. ఈ సమయంలో, లిల్లీప్యాడ్ల మధ్య సమానంగా ఖాళీ ఉంటుంది.

      ', + 'ml': '

      ഇപ്പോൾ ഞരമ്പുകളിലുള്ള താമരപ്പൂവും കടൽക്കരയിലേക്ക് നീങ്ങുന്നു, അവ തമ്മിൽ ഇടം വർദ്ധിപ്പിക്കുന്നു. justify-content. ഉപയോഗിച്ച്. താമര ഇലകൾക്ക് ഇടയിൽ ഒരേ ദൂരം ആണ്

      ', + 'el': '

      Τώρα τα νούφαρα στις άκρες έχουν παρασυρθεί στην ακτή, αυξάνοντας το διάστημα μεταξύ τους. Χρησιμοποιήστε το justify-content. Αυτή την φορά, τα νούφαρα έχουν ίσο διάστημα μεταξύ τους.

      ', + 'mk': '

      Сега листовите на рабовите се имаат придвижено кон брегот, зголемувајќи го просторот помеѓу нив. Користете justify-content. Овој пат, листовите имаат еднаков простор помеѓу нив.

      ', + 'lv': '

      Tagad visas ūdensrozes ir pavirzījušās uz dīķa krastu un palielinājušas atstarpi viena no otras. Lieto justify-content. Šoreiz atstarpe starp ūdensrozēn ir vienāda.

      ', + 'id': '

      Sekarang lilypads berada di tepi pantai, tambahkan jarak di antara mereka. Gunakan justify-content. Kali ini, lilypads harus memiliki jarak yang sama diantara mereka.

      ', + 'ar': '

      انجرفت اوراق الزنبق التي بالاطراف الى حواف الشاطئ, وازدادت الفراغات بينها. استخدم justify-content. هذه المرة, اوراق الزنبق بينها فراغات متساوية.

      ', + 'ca': '

      Ara els nenúfars de les vores s\'han desplaçat a un costat, augmentant així l\'espai entre elles. Utilitza justify-content. Aquest cop, els nenúfars tenen el mateix espai entre elles.

      ', + 'da': '

      Nu er åkanderne i kanterne drevet mod kysten, så afstanden mellem dem er øget. Brug justify-content. Denne gang er der fast afstand imellem åkanderne.

      ', + 'et': '

      Vesiroosilehed on triivinud äärtesse, vahemaa nende vahel on nüüd veel suurem. Kasuta justify-content. Seekord on vesiroosilehtede vahel sama suur vahe.

      ', + 'fi': '

      Nyt reunoilla olevat lumpeenlehdet ovat ajelehtineet rantaan, joten niiden välissä on enemmän tilaa. Käytä taas ominaisuutta justify-content. Tällä kertaa lumpeenlehtien välissä on yhtä paljon tilaa.

      ', + 'gl': '

      Agora os nenúfares dos bordes desprazáronse ata a ribeira, aumentando o espazo entre que hai entre eles. Usa justify-content. Desta vez, os nenúfares teñen o mesmo espazo entre eles.

      ', + 'th': '

      จากนี้ ใบบัวตรงขอบๆได้ลอยไปติดฝั่ง, ทำให้เพิ่มช่องว่างระหว่างใบบัว ใช้คำสั่ง justify-content ในครั้งนี้, ใบบัวมีพื้นที่ระหว่างกันเท่ากัน

      ', + 'mn': '

      Захад байсан сараана цэцэгc одоо эрэг рүү урсаж, хоорондын зайгаа ихэсгэсэн байна. justify-content-г ашиглана уу. Энэ удаад сараана цэцэгсийн хоорондох зай тэнцүү байна.

      ' + }, + board: 'gyr', + style: { 'justify-content': 'space-between' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'align-items 1', + instructions: { + 'en': '

      Now use align-items to help the frogs get to the bottom of the pond. This CSS property aligns items vertically and accepts the following values:

      • flex-start: Items align to the top of the container.
      • flex-end: Items align to the bottom of the container.
      • center: Items align at the vertical center of the container.
      • baseline: Items display at the baseline of the container.
      • stretch: Items are stretched to fit the container.
      ', + 'he': '

      עכשיו תשתמשו ב-align-items כדי לעזור לצפרדעים להגיע לתחתית האגם. התכונת CSS הזו מיישרת פריטים בציר האנכי ומקבלת את הערכים הבאים:

      • flex-start: יישור הפריטים לחלק העליון של הקונטיינר.
      • flex-end: יישור פריטים לחלק התחתון של הקונטיינר.
      • center: יישור פריטים לאמצע הקו האנכי של הקונטיינר.
      • baseline: הפריטים יוצגו בקו הבסיס של הקונטיינר.
      • stretch: הפריטים יימתחו כדי להתאים לקונטיינר.
      ', + 'ro': '

      Acum folosește align-items pentru a ajuta broaștele să ajungă la fundul lacului. Această proprietate CSS aliniază elementele vertical și acceptă următoarele valori:

      • flex-start: Elementele se aliniază în partea de sus a containerului.
      • flex-end: Elementele se aliniază în partea de jos a containerului.
      • center: Elementele se aliniază in centrul vertical al containerului.
      • baseline: Elementele sunt afișate la linia de baza a containerului.
      • stretch: Elementele sunt întinse să se potrivească în container.
      ', + 'bg': '

      Сега използвай align-items, за да помогнеш на жабчетата да достигнат до долния край на езерото. Това CSS свойство подрежда елементите вертикално и приема следните стойности:

      • flex-start: Елементите се подреждат в горната част на контейнера.
      • flex-end: Елементите се подреждат в долната част на контейнера.
      • center: Елементите се подреждат във вертикалния център на контейнера.
      • baseline: Елементите се подреждат на базовата линия на контейнера.
      • stretch: Елементите се разпъват, за да паснат в контейнера.
      ', + 'de': '

      Verwende nun align-items, um den Fröschen zu helfen, das untere Ende des Teichs zu erreichen. Diese CSS-Eigenschaft richtet die Elemente vertikal aus und akzeptiert die folgenden Werte:

      • flex-start: Elemente oben am Container ausrichten.
      • flex-end: Elemente unten am Container ausrichten.
      • center: Elemente mittig im Container ausrichten.
      • baseline: Elemente an der Grundlinie des Containers ausrichten.
      • stretch: Elemente strecken, um den Container auszufüllen.
      ', + 'pt-br': '

      Agora use align-items para levar os sapos ao fundo da lagoa. Essa propriedade CSS alinha os itens verticalmente e aceita os seguintes valores:

      • flex-start: Itens se alinham na parte de cima do container.
      • flex-end: Itens se alinham na parte de baixo do container.
      • center: Itens se alinham no centro vertical do container.
      • baseline: Items se alinham na linha da base do container.
      • stretch: Itens se esticam para preencher o container.
      ', + 'es': '

      Ahora usa align-items para ayudar a las ranas a llegar al fondo del estanque. Esta propiedad CSS alinea elementos verticalmente y acepta los siguientes valores:

      • flex-start: Alinea elementos a la parte superior del contenedor.
      • flex-end: Alinea elementos a la parte inferior del contenedor.
      • center: Alinea elementos en el centro (verticalmente hablando) del contenedor.
      • baseline: Muestra elementos en la línea base del contenedor
      • stretch: Elementos se estiran para ajustarse al contenedor.
      ', + 'fr': '

      Maintenant, utilisez align-items pour aider les grenouilles à se rendre au bas de l\'étang. Cette propriété CSS aligne les éléments verticalement et accepte les valeurs suivantes :

      • flex-start : Les éléments s\'alignent au haut du conteneur.
      • flex-end : Les éléments s\'alignent au bas du conteneur.
      • center : Les éléments s\'alignent au centre vertical du conteneur.
      • baseline : Les éléments s\'alignent à la ligne de base du conteneur.
      • stretch : Les éléments sont étirés pour s\'adapter au conteneur.
      ', + 'ru': '

      Теперь используй align-items, чтобы помочь лягушатам добраться до нижней части пруда. Это свойство CSS выравнивает элементы вертикально и принимает следующие значения:

      • flex-start: элементы выравниваются по верхнему краю контейнера.
      • flex-end: элементы выравниваются по нижнему краю контейнера.
      • center: элементы выравниваются вертикально по центру контейнера.
      • baseline: элементы отображаются на базовой линии контейнера.
      • stretch: элементы растягиваются, чтобы заполнить контейнер.
      ', + 'fa': '

      در حال حاضر با استفاده از align-items به قورباغه ها کمک کنید تا به پایین برکه برسند.این خاصیت ایتم ها را در محور عمودی تراز بندی می کند و مقادیر آن عبارتند از :

      • flex-start: آیتم‌ها از نقطه ابتدایی محور عمودی چیده می‌شوند.
      • flex-end: آیتم‌ها از نقطه انتهایی محور عمودی چیده می‌شوند.
      • center: آیتم‌ها در وسط محور عمودی چیده می‌شوند.
      • baseline: آیتم ها بر اساس Baselineشان هم‌تراز می‌شوند
      • stretch: در صورتی که ارتفاع آیتم‌ها مشخص نشده باشد، آیتم ها کشیده میشوند و Flex line را پر میکنند.
      ', + 'zh-cn': '

      现在用align-items来帮助青蛙们到池塘的底部。这个CSS属性纵向对齐元素并且可选以下几个值：

      • flex-start: 元素与容器的顶部对齐。
      • flex-end: 元素与容器的底部对齐。
      • center: 元素纵向居中。
      • baseline: 元素在容器的基线位置显示。
      • stretch: 元素被拉伸以填满整个容器。
      ', + 'zh-tw': '

      現在用align-items來幫助青蛙們到池塘的底部。這個CSS屬性縱向對齊元素並且可選以下幾個值：

      • flex-start: 元素與容器的頂部對齊。
      • flex-end: 元素與容器的底部對齊。
      • center: 元素縱向居中。
      • baseline: 元素在容器的基線位置顯示。
      • stretch: 元素被拉伸以填滿整個容器。
      ', + 'tr': '

      Şimdi, align-items kuralını kullanarak kurbağaların gölün aşağısına gitmesine yardımcı olun. Bu CSS kuralı öğeleri dikey olarak hizalar ve şu değerleri alır:

      • flex-start: Öğeleri flexbox container\'ın tepesine hizalar
      • flex-end: Öğeleri flexbox container\'ın aşağısına hizalar
      • center: Öğeleri flexbox container\'ın dikey ortasına hizalar
      • baseline: Öğeleri flexbox container\'ın yazı referans çizgisine(baseline) hizalar.
      • stretch: Öğeler flexbox container boyunca uzarlar
      ', + 'az': '

      İndi, align-items qaydasını istifadə edərək qurbağaların gölün aşağısına çatmağına kömək edin. Bu CSS qaydası elementləri şaquli şəkildə nizamlayar və bu dəyərləri qəbul edir:

      • flex-start: Elementləri flexbox container\'inin üstünə nizamlayar
      • flex-end: Elementləri flexbox container\'inin aşağısına nizamlayar
      • center: Elementləri flexbox container\'inin şaquli ortasına nizamlayar
      • baseline: Elementləri flexbox container\'inin yazı referans xəttinə(baseline) nizamlayar.
      • stretch: Elementlər flexbox container boyunca uzanarlar
      ', + 'it': '

      Adesso usa align-items per aiutare le rane ad arrivare alla fine dello stagno. Questa proprietà CSS allinea gli elementi verticalmente ed accetta i seguenti valori:

      • flex-start: Allinea gli elementi all\'inizio del loro contenitore.
      • flex-end: Allinea gli elementi alla fine del loro contenitore.
      • center: Centra gli elementi verticalmente.
      • baseline: Gli elementi vengono disposti in modo da allineare le loro linee di base.
      • stretch: Gli elementi sono allungati per occupare tutto il contenitore.
      ', + 'ko': '

      이제 align-items를 사용하여 개구리들이 연못의 아래쪽에 도착할 수 있도록 도와주세요. 이 CSS 속성은 다음의 값들을 인자로 받아 요소들을 세로선 상에서 정렬합니다:

      • flex-start: 요소들을 컨테이너의 꼭대기로 정렬합니다.
      • flex-end: 요소들을 컨테이너의 바닥으로 정렬합니다.
      • center: 요소들을 컨테이너의 세로선 상의 가운데로 정렬합니다.
      • baseline: 요소들을 컨테이너의 시작 위치에 정렬합니다.
      • stretch: 요소들을 컨테이너에 맞도록 늘립니다.
      ', + 'lt': '

      Dabar panaudokite align-items, kad padėtumėte varlytėms nusigauti į tvenkinio apačią. Ši CSS komanda lygiuoja elementus vertikaliai ir reguoja į šias vertes:

      • flex-start: Elementai lygiuojami supančio elemento viršuje.
      • flex-end: Elementai lygiuojami supančio elemento apačioje.
      • center: Elementai lygiuojami vertikaliai supančio elemento viduryje.
      • baseline: Elementai atvaizduojami palei apatinę supančio elemento liniją.
      • stretch: Elementai yra ištempiami, kad užpildytų supantį elementą.
      ', + 'vi': '

      Bây giờ sử dụng align-items để giúp những chú ếch đến đáy của ao. Từ thuộc tính CSS này sắp xếp những hạng mục theo chiều dọc và chấp nhận các giá trị sau:

      • flex-start: Các hạng mục sẽ được sắp xếp phía trên của hộp chứa.
      • flex-end: Các hạng mục sẽ được sắp xếp phía dưới cùng của hộp chứa.
      • center: Các hạng mục sẽ được sắp xếp ở giữa chính của hộp chứa.
      • baseline: Các hạng mục sẽ được hiển thị ở đường cơ bản của hộp chứa.
      • stretch: Các hạng mục sẽ được kéo dài để phù hợp với hộp chứa.
      ', + 'pl': '

      A teraz przy pomocy align-items zaprowadź żabki na spód stawu. Ta właściwość CSS wyrównuje elementy w pionie i przyjmuje wartości:

      • flex-start: Elementy wyrównują się do górnej krawędzi kontenera.
      • flex-end: Elementy wyrównują się do dolnej krawędzi kontenera.
      • center: Elementy zostaną wyśrodkowane w pionie.
      • baseline: Elementy zostaną wyświetlone na linii odniesienia kontenera.
      • stretch: Elementy zostaną powiększone tak, aby wypełnić kontener.
      ', + 'cs': '

      Použijte align-items tak, aby se žabky dostaly na spodní stranu rybníka. Tato CSS vlastnost zarovnává prvky svisle a nabývá hodnot:

      • flex-start: Zarovná prvky nahoru.
      • flex-end: Zarovná prvky dolů.
      • center: Zarovná prvky na střed kontejneru.
      • baseline: Zarovná prvky na účaří.
      • stretch: Roztáhne prvky tak, aby vyplnily kontejner.
      ', + 'ja': '

      今度はalign-itemsを使って池の下のほうへカエルを連れていきましょう。このCSSプロパティーはアイテムを垂直に並べ、以下の値をとります。

      • flex-start: アイテムはコンテナーの上部に並びます。
      • flex-end: アイテムはコンテナーの下部に並びます。
      • center: アイテムはコンテナーの垂直方向中央に並びます。
      • baseline: アイテムはコンテナーのベースラインに表示されます。
      • stretch: アイテムはコンテナーの大きさに合うよう広がります。
      ', + 'hu': '

      Most használd az align-items tulajdonságot, ezzel hozzásegítve a békákat ahhoz, hogy a tavacska aljához jussanak. Ez a CSS tulajdonság az elemeket függőlegesen igazítja és a következő értékeket kaphatja:

      • flex-start: Az elemek a konténer tetejére igazodnak.
      • flex-end: Az elemek a konténer aljára igazodnak.
      • center: Az elemek a konténeren belül függőlegesen középre igazodnak.
      • baseline: Az elemek a konténerben a szöveg alapvonalához igazodnak.
      • stretch: Az elemek széthúzódnak, kifeszülnek, hogy kitöltsék a konténert.
      ', + 'eo': '

      Nun uzu align-items por helpi la ranojn iri al la fundo de la lageto. Ĉi tiu CSS-a trajto vertikale vicigas elementojn kaj akceptas la sekvajn valorojn:

      • flex-start: Elementoj linias supren de la ujo.
      • flex-end: Elementoj linias malsupren de la ujo.
      • center: Elementoj linias je la vertikala centro de la ujo.
      • baseline: Elementoj afiŝas je la bazlinio de la ujo.
      • stretch: Elementoj streĉiĝas por ke ili laŭmezure kovru la ujon.
      ', + 'sv': '

      Använd align-items för att hjälpa grodorna att ta sig längst ner i dammen. Detta attribut justerar dem vertikalt och accepterar följande värden:

      • flex-start: Objekt justeras till toppen av containern.
      • flex-end: Objekt justeras till botten av containern.
      • center: Objekt justeras till mitten av containern vertikalt.
      • baseline: Objekt justeras till baslinjen i containern
      • stretch: Objekt sträcks ut för att fylla containern.
      ', + 'uk': '

      Скористайся align-items для допомоги жабенятам дістатися до нижньої частини ставка. Ця CSS властивість вирівнює елементи вертикально і може набувати таких значень:

      • flex-start: елементи вирівнюються за верхнім краєм контейнеру.
      • flex-end: елементи вирівнюються за нижнім краєм контейнеру.
      • center: елементи вирівнюються вертикально по середині контейнера.
      • baseline: елементи буде розміщено на базовій лінії контейнера.
      • stretch: елементи розтягуються заповнюючи контейнер.
      ', + 'hi': '

      अब align-items की मदद से मेंढकों को तालाब की तलहटी तक पहुंचाइये। यह CSS प्रॉपर्टी वस्तुओं को लम्बाई में संरेखित करती है एवं निम्न मूल्यों का उपयोग करती है:

      • flex-start: यह वस्तुओं को कंटेनर के उपर संरेखित करता है।
      • flex-end: यह वस्तुओं को कंटेनर के अंत में संरेखित करता है।
      • center: यह वस्तुओं को कंटेनर की खड़ी केंद्र में संरेखित करता है।
      • baseline: यह वस्तुओं को कंटेनर की आधार रेखा पर प्रदर्शित करता है।
      • stretch: यह वस्तुओं को कंटेनर में फिट करने के लिए फैला देता है।
      ', + 'sr': '

      Сада користи align-items да помогнеш жабицама да дођу до дна барице. Ово CSS својство поравњава елементе вертикално и прихвата следеће вредности:

      • flex-start: Поравњава елементе у горњи део контејнера.
      • flex-end: Поравњава елементе у доњи део контејнера.
      • center: Поравњава елементе у вертикални центар контејнера.
      • baseline: Елементи су приказани у линији са baseline (линијом текста) контејнера.
      • stretch: Елементи су развучени да попуне контејнер.
      ', + 'bs': '

      Sada koristi align-items da pomogneš žabicama da dođu do dna barice. Ovo CSS svojstvo poravnava elemente vertikalno i prihvata sledeće vrijednosti:

      • flex-start: Poravnava elemente u gornji deo kontejnera.
      • flex-end: Poravnava elemente u donji deo kontejnera.
      • center: Poravnava elemente u vertikalni centar kontejnera.
      • baseline: Elementi su prikazani u liniji sa baseline (linijom teksta) kontejnera.
      • stretch: Elementi su razvučeni da popune kontejner.
      ', + 'hr': '

      Sada koristi align-items da pomogneš žabicama da dođu do dna barice. Ovo CSS svojstvo poravnava elemente vertikalno i prihvaća sljedeće vrijednosti:

      • flex-start: Poravnava elemente u gornji dio kontejnera.
      • flex-end: Poravnava elemente u donji dio kontejnera.
      • center: Poravnava elemente u vertikalni centar kontejnera.
      • baseline: Elementi su prikazani u liniji sa baseline (linijom teksta) kontejnera.
      • stretch: Elementi su razvučeni da popune kontejner.
      ', + 'nl': '

      Maak nu gebruik van align-items om de kikkers naar de onderkant van de vijver te helpen. Deze CSS eigenschap lijnt elementen verticaal uit, en aanvaard de volgende waarden:

      • flex-start: Elementen worden uitgelijnd naar de bovenkant van de container.
      • flex-end: Elementen worden uitgelijnd naar de onderkant van de container.
      • center: Elementen worden uitgelijnd op het verticaal middelpunt van de container.
      • baseline: Elementen worden uitgelijnd op de basislijn van de container.
      • stretch: Elementen worden uitgerokken om binnen de container te passen.
      ', + 'ta': '

      இப்பொழுது align-items உபயோகித்து, தவளைகள் குளத்தின் கீழ் பகுதிக்கு செல்ல உதவி செய்யவும். இந்த CSS property செங்குத்தாக பொருட்களை உபகரணங்களை சீரமைக்கும் மற்றும் பின்வரும் மதிப்புகளை ஏற்றுக்கொள்கிறது:

      • flex-start: Items மேற்புறமாக சீரமைக்கப்படும்.
      • flex-end: Items கீழ்புறமாக சீரமைக்கப்படும்.
      • center: Items செங்குத்து மத்தியத்தில் சீரமைக்கப்படும்.
      • baseline: Items, baseline பகுதியில் சீரமைக்கப்படும்.
      • stretch: Items, container-ல் பொருந்தும் வண்ணம் நீட்டி சீரமைக்கப்படும்.
      ', + 'te': '

      ఇప్పుడు కప్పలు చెరువు దిగువకు రావడానికి align-items ని ఉపయోగించండి. ఈ CSS ఆస్తి అంశాలను నిలువుగా సమలేఖనం చేస్తుంది మరియు ఈ క్రింది విలువలను అంగీకరిస్తుంది:

      • flex-start: వస్తువులు కంటైనర్ పైభాగానికి సమలేఖనం చేయబడతాయి.
      • flex-end: వస్తువులు కంటైనర్ దిగువకు సమలేఖనం చేయబడతాయి.
      • center: వస్తువులు కంటైనర్ యొక్క నిలువు మధ్యలో సమలేఖనం చేయబడతాయి.
      • baseline: వస్తువులు కంటైనర్ యొక్క బేస్‌లైన్ వద్ద ప్రదర్శించబడతాయి.
      • stretch: కంటైనర్‌కు సరిపోయేలా, వస్తువులు విస్తరిస్తాయి.
      ', + 'ml': '

      align-items ഉപയോഗിച്ച് തവളകളെ തടാകത്തിന്റെ താഴേക്കു എത്തിക്കുക. ഈ CSS വസ്തു ലംബമായി ഇനങ്ങളെ വിന്യസിക്കുന്നു

      • flex-start: ഇനങ്ങൾ കണ്ടെയ്നർ മുകളിൽ വയ്ക്കുക.
      • flex-end: ഇനങ്ങൾ കണ്ടെയ്നറിന് താഴെയായി വിന്യസിക്കുക.
      • center: ഇനങ്ങൾ കണ്ടെയ്നറിന്റെ ലംബമായ കേന്ദ്രത്തിൽ വിന്യസിക്കുക.
      • baseline: കണ്ടെയ്നറിന്റെ അടിസ്ഥാനത്തിൽ ഇനങ്ങൾ പ്രദർശിപ്പിക്കും.
      • stretch: ഇനങ്ങൾ കണ്ടെയ്നറിൽ വയ്ക്കാൻ ഇട്ടു.
      ', + 'el': '

      Τώρα χρησιμοποιήστε το align-items για να βοηθήσετε τους βατράχους να φτάσουν στο κάτω μέρος της λιμνούλας. Αυτή η ιδιότητα CSS ευθυγραμμίζει αντικείμενα στον κάθετο άξονα και αποδέχεται τις εξής αξίες:

      • flex-start: Τα αντικείμενα ευθυγραμμίζονται στο πάνω μέρος του container.
      • flex-end: Τα αντικείμενα ευθυγραμμίζονται στο κάτω μέρος του container.
      • center: Τα αντικείμενα ευθυγραμμίζονται στο κάθετο κέντρο του container.
      • baseline: Τα αντικείμενα εμφανίζονται στην βασική γραμμή του container.
      • stretch: Τα αντικείμενα τεντώνονται για να ταιριάξουν στο container.
      ', + 'mk': '

      Сега користете align-items да им помогнете на жабите да стигнат до дното на езерцето. Ова CSS својство ги подредува елементите вертикално и ги прима следните вредности:

      • flex-start: Елементите се подредуваат по горниот крај на контејнерот.
      • flex-end: Елементите се подредуваат по долниот крај на контејнерот.
      • center: Елементите се подредуваат по вертикалниот центар на контејнерот.
      • baseline: Елементите се подредуваат по основната линија на контејнерот.
      • stretch: Елементите се истегнати за да го пополнат контејнерот.
      ', + 'lv': '

      Lai vardulēnus novirzītu uz dīķa apakšu,tagad pamēģinie pielietot align-items. Šī CSS metode novieto elementus vertikāli un pieņem šādas vērtības:

      • flex-start: Elementi tiek novietoti konteinera augšpusē.
      • flex-end: Elementi tiek novietoti konteinera apakšpusē.
      • center: Elementi konteinerā tiek vertikāli iecentrēti.
      • baseline: Elementi tiek novietoti konteinera bāzes līnijā.
      • stretch: Elementi tiek izstiepti, lai atbilstu konteinera izmēriem.
      ', + 'id': '

      Sekarang gunakan align-items untuk membantu ke dasar kolam. Properti CSS ini menyejajarkan objek secara vertikal dan menerima nilai-nilai berikut:

      • flex-start: Objek sejajar dengan bagian atas wadah.
      • flex-end : Objek sejajar dengan bagian bawah wadah.
      • center: Objek sejajar dengan bagian tengah wadah.
      • baseline: Item ditampilkan di garis dasar wadah.
      • stretch : Item diregangkan agar sesuai dengan wadah.
      ', + 'ar': '

      الان استخدم align-items لمساعدة الضفادع للذهاب الى اسفل البركة. هذه الخاصية في CSS تحاذي العناصر عاموديا وتقبل القيم التالية:

      • flex-start: محاذاة العناصر الى اعلى الحاوية.
      • flex-end: محاذاة العناصر الى اسفل الحاوية.
      • center: محاذاة العناصر الى وسط الحاوية عاموديا.
      • baseline: محاذاة العناصر على نفس الخط (Baseline) للحاوية.
      • stretch: تمدد العناصر عاموديا لتملئ الحاوية.
      ', + 'ca': '

      Ara utilitza align-items per ajudar a les granotes a arribar al fons de l\'estany. Aquesta propietat CSS alinea elements verticalment i accepta els següents valors:

      • flex-start: Alinea elements a la part superior del contenidor.
      • flex-end: Alinea elements a la part inferior del contenidor.
      • center: Alinea elements al centre (verticalment) del contenidor.
      • baseline: Mostra elements en la línia base del contenidor
      • stretch: Elements s\'estiren per ajustar-se al contenidor.
      ', + 'da': '

      Brug nu align-items for at hjælpe frøerne ned til bunden af dammen. Denne CSS-egenskab justerer elementer lodret og kan tage følgende værdier:

      • flex-start: Elementer justeres til toppen af beholderen.
      • flex-end: Elementer justeres til bunden af beholderen.
      • center: Elementer justeres lodret til midten af beholderen.
      • baseline: Elementer vises på beholderens grundlinje.
      • stretch: Elementer strækkes så de passer i beholderen.
      ', + 'et': '

      Nüüd kasuta align-items, et aidata konnadel jõuda tiigi alumisse osasse. See CSS omadus joondab elemendid vertikaalselt ja kasutab järgmisi väärtusi:

      • flex-start: joondab elemendid konteineri ülemisse osasse.
      • flex-end: joondab elemendid konteineri alumisse osasse.
      • center: joondab elemendid konteineri keskele
      • baseline: Elemendid asuvad konteineri lähtekohas.
      • stretch: Elemendid on välja venitatud, et kõik nad mahuksid konteinerisse.
      ', + 'fi': '

      Nyt sinun on autettava sammakot lammen alareunaan käyttämällä ominaisuutta align-items, joka kohdistaa elementit pystysuunnassa. Voit antaa ominaisuudelle jonkin seuraavista arvoista:

      • flex-start: Elementit kohdistetaan säilön yläreunaan.
      • flex-end: Elementit kohdistetaan säilön alareunaan.
      • center: Elementit kohdistetaan pystysuuntaisesti säilön keskelle.
      • baseline: Elementit kohdistetaan säilön perusviivalle.
      • stretch: Elementit venytetään säilön koon mukaan.
      ', + 'gl': '

      Agora tes que usar align-items para axudar ás rás a chegar ao fondo da poza. Esta propiedade CSS aliña os elementos verticalmente e acepta os seguintes valores:

      • flex-start: Os elementos alíñanse na parte superior do contedor.
      • flex-end: Os elementos alíñanse na parte inferior do contedor.
      • center: Os elementos alíñanse no centro vertical do contedor.
      • baseline: Os elementos móstranse na liña base do contedor.
      • stretch: Os elementos estíranse entre si para axustarse ao contedor.
      ', + 'th': '

      จากนี้ ใช้คำสั่ง align-items เพื่อช่วยเจ้ากบทั้งหลายไปสู่ด้านล่างของสระน้ำ คุณสมบัติ CSS นี้จัดเรียง items ในแนวตั้ง และรับค่าดังต่อไปนี้:

      • flex-start: เรียง items ไปไว้ด้านบนของ container
      • flex-end: เรียง items ไปไว้ด้านล่างของ container
      • center: เรียง items ไปไว้ตรงกลางในแนวตั้งของ container
      • baseline: แสดง items ที่แนวบรรทัดของ container
      • stretch: items จะถูกดึงให้พอดีกับ container
      ', + 'mn': '

      Одоо align-items-г ашиглан мэлхий цөөрмийн ёроолд хүрэхэд нь туслаарай. Энэ CSS проперти нь items-г босоо тэнхлэгийн дагуу байрлуулах ба дараах утгуудыг хүлээн зөвшөөрдөг:

      • flex-start: items-г контейнерын дээд талд байрлуулна.
      • < code>flex-end: items-г контейнерын ёроолд байрлуулна.
      • center: items-г контейнерын босоо төвд байрлуулна.
        • < li>baseline: items-г контейнерын суурь дээр харуулна.
      • stretch: items-г контейнерт тааруулж сунгана.
        • ' + }, + board: 'gyr', + style: { 'align-items': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'align-items 2', + instructions: { + 'en': '

        Lead the frog to the center of the pond using a combination of justify-content and align-items.

        ', + 'he': '

        הובילו את הצפרדע למרכז האגם על ידי שילוב של justify-content ושל align-items.

        ', + 'ro': '

        Îndrumă broasca către centrul lacului folosind o combinație de justify-content și align-items.

        ', + 'bg': '

        Заведи жабчето до центъра на езерото, използвайки комбинация от justify-content и align-items.

        ', + 'de': '

        Führe den Frosch zur Mitte des Teichs, indem du justify-content und align-items in kombinierst.

        ', + 'pt-br': '

        Leve o sapo ao centro da lagoa usando uma combinação de justify-content e align-items.

        ', + 'es': '

        Mueve la rana al centro del estanque, usando una combinación de justify-content y align-items.

        ', + 'fr': '

        Dirigez la grenouille au centre de l\'étang en utilisant une combinaison de justify-content et align-items.

        ', + 'ru': '

        Направь лягушонка в центр пруда, используя justify-content и align-items вместе.

        ', + 'fa': '

        قورباغه را به وسط برکه هدایت کنید برای این کار از ترکیب خاصیت های justify-content و align-items استفاده کنید.

        ', + 'zh-cn': '

        使用justify-content和align-items的组合来指引青蛙们到池塘中央。

        ', + 'zh-tw': '

        使用justify-content和align-items的組合來指引青蛙們到池塘中央。

        ', + 'tr': '

        Kurbağayı justify-content ve align-items kurallarını kullanarak gölün ortasına yönlendirin.

        ', + 'az': '

        Qurbağanı justify-content və align-items qaydalarını istifadə edərək gölün ortasına yönləndirin.

        ', + 'it': '

        Dirigi la rana al centro dello stagno usando sia justify-content sia align-items.

        ', + 'ko': '

        justify-content와 align-items를 함께 사용하여 개구리가 연못의 중앙으로 이동할 수 있도록 도와주세요.

        ', + 'lt': '

        Padėkite varlytei nusigauti į vidurį tvenkinio naudodami justify-content ir align-items kombinaciją.

        ', + 'vi': '

        Dẫn chú ếch đến trung tâm của ao bằng cách kết hợp justify-content và align-items.

        ', + 'pl': '

        Zaprowadź żabkę na środek stawu przy pomocy justify-content i align-items.

        ', + 'cs': '

        Dostaňte žabku doprostřed rybníka kombinací justify-content a align-items.

        ', + 'ja': 'justify-contentとalign-itemsの組み合わせを使って、カエルを池の中央へ連れていきましょう。', + 'hu': '

        Vezesd a békát a tavacska közepére, kombináld a justify-content és az align-items tulajdonságokat.

        ', + 'eo': '

        Konduku la ranon al la centro de la lageto uzante kombinon de justify-content kaj align-items.

        ', + 'sv': '

        Hjälp grodan till mitten genom att använda en kombination av justify-content och align-items.

        ', + 'uk': '

        Скеруй жабеня до центру ставка, використовуючи разом justify-content та align-items.

        ', + 'hi': '

        justify-content एवं align-items का प्रयोग करते हुए मेंढक को तालाब के केंद्र तक पहुंचाइये।

        ', + 'sr': '

        Доведи жабицу у центар барице комбинујући justify-content и align-items.

        ', + 'bs': '

        Dovedi žabicu u centar barice kombinujući justify-content i align-items.

        ', + 'hr': '

        Dovedi žabicu u centar barice kombinirajući justify-content i align-items.

        ', + 'nl': '

        Leidt de kikkers naar het midden van de vijver via een combinatie van justify-content en align-items.

        ', + 'ta': '

        justify-content மற்றும் align-items பயன்படுத்தி குளத்தின் மையத்தில் தவளை செல்ல வழி காட்டவும்.

        ', + 'te': '

        justify-content మరియు align-items కలయికను ఉపయోగించి కప్పను చెరువు మధ్యలోకి నడిపించండి. ', + 'ml': '

        justify-content and align-items ഉപയോഗിച്ച് കുളത്തിന്റെ നടുവിലേക്ക് തവളയെ നയിക്കുക.

        ', + 'el': '

        Οδηγήστε τον βάτραχο στο κέντρο της λιμνούλας χρησιμοποιώντας έναν συνδυασμό του justify-content και του align-items.

        ', + 'mk': '

        Доведете ја жабата до центарот на езерцето користејќи комбинација од justify-content и align-items.

        ', + 'lv': '

        Lietojot justify-content un align-items, nogādā vardulēnu uz dīķa vidu.

        ', + 'id': '

        Arahkan katak ke tengah kolam menggunakan kombinasi dari justify-content dan align-items.

        ', + 'ar': '

        وجه الضفدع الى وسط البركة باستخدام كل من justify-content و align-items.

        ', + 'ca': '

        Mou la granota al centre de l\'estany, utilitzant una combinació de justify-content i align-items.

        ', + 'da': '

        Led frøen hen til midten af dammen med en kombination af justify-content og align-items.

        ', + 'et': '

        Juhi konn tiigi keskele kasutades kombinatsioone kahest järgmisest:justify-content ja align-items.

        ', + 'fi': '

        Opasta sammakko lammen keskelle käyttämällä ominaisuuksia justify-content ja align-items yhdessä.

        ', + 'gl': '

        Guía á rá ata o centro da poza combinando justify-content e align-items.

        ', + 'th': '

        พาเจ้ากบไปยังกลางสระ โดยใช้คำสั่งทั้ง justify-content และ align-items ร่วมกัน

        ', + 'mn': '

        Мэлхийг justify-content болон align-items-н хослолыг ашиглан цөөрмийн төв рүү хөтлөөрэй.

        ' + }, + board: 'g', + style: { 'justify-content': 'center', 'align-items': 'center' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'align-items 3', + instructions: { + 'en': '

        The frogs need to cross the pond again, this time for some lilypads with plenty of space around them. Use a combination of justify-content and align-items.

        ', + 'he': '

        הצפרדעים שוב צריכות לחצות את האגם, הפעם העלים עם הרבה מרווחים בינהם. השתמשו בשילוב של justify-content ושל align-items.

        ', + 'ro': '

        Broaștele trebuie să treacă lacul din nou, de această dată unii nuferi au mult spațiu în jurul lor. Folosește o combinație de justify-content și align-items.

        ', + 'bg': '

        Жабчетата трябва да преминат през езерото отново, този път до листа с доста разстояние около себе си. Използвай комбинация от justify-content и align-items.

        ', + 'de': '

        Die Frösche müssen den Teich erneut überqueren. Dieses Mal haben die Seerosenblätter eine ganze Menge Abstand zueinander. Kombiniere justify-content und align-items.

        ', + 'pt-br': '

        Os sapos precisam atravessar a lagoa de novo, desta vez para algumas vitórias-régias com bastante espaço em torno delas. Use uma combinação de justify-content e align-items.

        ', + 'es': '

        Nuevamente, las ranas necesitan cruzar el estanque. En esta oportunidad, las hojas de lirio tienen mucho espacio alrededor de ellas. Debes usar una combinación de justify-content y align-items.

        ', + 'fr': '

        Les grenouilles doivent encore traverser l\'étang. Cette fois-ci, les nénuphars ont beaucoup d\'espace autour d\'eux. Utilisez une combinaison de justify-content et align-items.

        ', + 'ru': '

        Лягушатам снова нужно пересечь пруд. В этот раз к лилиям, с достаточно большим пространством вокруг них. Используй комбинацию justify-content и align-items.

        ', + 'fa': '

        قروباغه ها نیاز دارند که به انتهای برکه برسند, دقت داشته باشید که فضای خالی اطراف نیلوفر های آبی وجود دارد. برای این کار از خاصیت های justify-content و align-items استفاده کنید.

        ', + 'zh-cn': '

        这些青蛙又需要穿过池塘了。这次有些荷叶周围有充足的距离。用justify-content和align-items的组合。

        ', + 'zh-tw': '

        這些青蛙又需要穿過池塘了。這次有些荷葉周圍有充足的距離。用justify-content和align-items的組合。

        ', + 'tr': '

        Kurbağaların, bu serfer etraflarında bolca boş alan olan nilüfer yapraklarına ulaşmaları için tekrar gölü geçmeleri gerekiyor. justify-content ve align-items kombinasyonunu kullanın.

        ', + 'az': '

        Qurbağaların, bu səfər ətraflarında bol şəkildə boş sahə olan zanbaq yarpaqlarına çatmaqları üçün təkrarən gölü keçməlidirlər. justify-content və align-items kombinasiyasını istifadə edin.

        ', + 'it': '

        Le rane devono di nuovo attraversare lo stagno. Questa volta le ninfee hanno parecchio spazio attorno ad esse. Usa sia justify-content sia align-items.

        ', + 'ko': '

        개구리들이 연못을 다시 건너려고 하는데, 수련잎 주위에 간격이 있습니다. justify-content와 align-items를 함께 사용하세요.

        ', + 'lt': '

        Varlytėms vėl reikia persikelti į kitą tvenkinio vietą, šį kartą ant lelijos lapų, aplink kuriuos yra pakankamai vietos. Naudokite justify-content ir align-items kombinaciją.

        ', + 'vi': '

        Những chú ếch cần phải qua ao một lần nữa, lần này các lá bông súng có nhiều không gian xung quanh chúng. Kết hợp justify-content và align-items.

        ', + 'pl': '

        Żabki znowu muszą przejść na drugą stronę stawu. Tym razem muszą znaleźć się na listkach, które mają dużo miejsca wokół siebie. Skorzystaj z kombinacji justify-content i align-items.

        ', + 'cs': '

        Žabky znovu potřebují na spodek rybníka, teď jsou však mezi lekníny velké mezery. Použijte kombinaci vlastností justify-content a align-items.

        ', + 'ja': '

        再びカエルが池を渡ろうとしています。今度の蓮の葉はずいぶん間隔が空いているようですね。justify-contentとalign-itemsの組み合わせを使いましょう。

        ', + 'hu': '

        A békáknak ismét át kell szelniük a tavat, ezúttal néhány tündérrózsáért, melyek között meglehetősen sok az üres tér. Használd a justify-content és az align-items kombinációját.

        ', + 'eo': '

        La ranoj bezonas de nove transiri la lageton, ĉifoje por atingi nimfeofoliojn kun sufiĉe da spaco ĉirkaŭ ili. Uzante kombinon de justify-content kaj align-items.

        ', + 'sv': '

        Grodorna behöver korsa dammen igen och denna gång är blombladen långt ifrån varandra. Använd en kombination av justify-content och align-items.

        ', + 'uk': '

        Жабенята знову мають перетнути ставок, цього разу навколо листя латаття є чималий простір. Поєднай разом justify-content та align-items, щоб досягти результату.

        ', + 'hi': '

        मेंढकों को पुनः तालाब पार करना है, इस समय लिली के पत्तों के मध्य काफी जगह मोजूद है। justify-content एवं align-items का प्रयोग कीजिये।

        ', + 'sr': '

        Жабице опет треба да пређу барицу, овог пута до локвања око којих има много простора. Комбинуј justify-content и align-items.

        ', + 'bs': '

        Žabice opet treba da pređu baricu, ovog puta do lista oko kojih ima mnogo prostora. Kombinuj justify-content i align-items.

        ', + 'hr': '

        Žabice opet trebaju prijeći baricu, ovog puta do listova oko kojih ima mnogo prostora. Kombiniraj justify-content i align-items.

        ', + 'nl': '

        De kikkers moeten de vijver weer oversteken, deze keer is er veel plek rond hun lelieblaadjes. Maak gebruik van een combinatie van justify-content en align-items.

        ', + 'ta': '

        தவளைகள் மீண்டும் குளம் கடக்க வேண்டும், இம்முறை இலைகளை சுற்றி நிறைய வெற்றிடம் உள்ளது. justify-content மற்றும் align-items பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

        ', + 'te': '

        కప్పలు మళ్ళీ చెరువును దాటాలి, ఈ సమయంలో కొన్ని లిల్లీప్యాడ్ల చుట్టూ చాలా స్థలం ఉంది. justify-content మరియు align-items కలయికను ఉపయోగించడం.

        ', + 'ml': '

        justify-content and align-items ഉപയോഗിച്ച് തവളകൾ വീണ്ടും കുളത്തിനടുത്ത് വേണം, ഈ സമയം ചില താമരപ്പൂക്കൾ അവർക്ക് ചുറ്റും ധാരാളം സ്ഥലങ്ങളുണ്ട്.

        ', + 'el': '

        Οι βάτραχοι χρειάζεται να διασχίσουν ξανά την λιμνούλα, αυτή την φορά για να φτάσουν σε μερικά νούφαρα με άπλετο διάστημα τριγύρω τους. Χρησιμοποιήστε έναν συνδυασμό του justify-content και του align-items.

        ', + 'mk': '

        Жабите треба да го поминат езерцето повторно, овој пат до листови со многу простор околу нив. Користејќи комбинација од justify-content и align-items.

        ', + 'lv': '

        Vardulēniem atkal ir jāšķērso dīķis, šoreiz ir jānokļūst pie ūdensrozēm ap kurām ir plašs apkārtesošais laukums. Lietojo justify-content un align-items, un palīdzi viņiem to izdarīt.

        ', + 'id': '

        Katak harus menyeberangi kolam lagi, kali ini untuk beberapa lilypad dengan banyak ruang di sekitar mereka. Menggunakan kombinasi justify-content and align-items.

        ', + 'ar': '

        تحتاج الضفادع لعبور البركة مرة اخرى, هناك فراغات كثيرة حول اوراق الزنبق. استخدم كل من justify-content و align-items.

        ', + 'ca': '

        De nou, les granotes necessiten creuar l\'estany. Aquest cop, els nenúfars tenen molt espai al seu voltant. Has d\'utilitzar una combinació de justify-content i align-items.

        ', + 'da': '

        Frøerne skal krydse dammen igen, og denne gang vil de hen til nogle åkander med rigelig plads omkring sig. Brug en kombination af justify-content og align-items.

        ', + 'et': '

        Konnad peavad taaskord üle tiigi saama, see kord on mõnedel vesiroosilehtede ümber vaba ruumi. Kasutage koos justify-content ja align-items.

        ', + 'fi': '

        Sammakoiden täytyy taas päästä lammen halki, tällä kertaa kaukana toisistaan olevien lumpeenlehtien luo. Määritä ominaisuudet justify-content ja align-items yhdessä.

        ', + 'gl': '

        As rás teñen que volver cruzar a poza, esta vez para chegar a uns nenúfares con moito espazo entre eles. Emprega unha combinación de justify-content e align-items.

        ', + 'th': '

        เจ้ากบต้องข้ามสระน้ำอีกครั้ง, คราวนี้บางใบบัวมีพื้นที่รอบๆค่อนข้างมาก ใช้คำสั่ง justify-content คู่กับ align-items

        ', + 'mn': '

        Мэлхийнүүд энэ удаад эргэн тойрондоо хангалттай зайтай сараана цэцэгсийн төлөө дахин цөөрмийг гатлах хэрэгтэй. justify-content болон align-items-н хослолыг ашиглана уу.

        ' + }, + board: 'gyr', + style: { 'justify-content': 'space-around', 'align-items': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 1', + instructions: { + 'en': '

        The frogs need to get in the same order as their lilypads using flex-direction. This CSS property defines the direction items are placed in the container, and accepts the following values:

        • row: Items are placed the same as the text direction.
        • row-reverse: Items are placed opposite to the text direction.
        • column: Items are placed top to bottom.
        • column-reverse: Items are placed bottom to top.
        ', + 'he': '

        הצפרדעים צריכות להגיע באותו סדר לעלים שלהן בשימוש ב-flex-direction. התכונת CSS הזו מגדירה את כיוון הסידור של הפריטים בקונטיינר,ומקבלת את הערכים הבאים:

        • row: פריטים מסודרים כמו בכיוון שהוגדר לטקסט.
        • row-reverse: פריטים מסודרים ההפך מהכיוון שהוגדר לטקסט.
        • column: פריטים מסודרים מלמעלה למטה (בעמודה).
        • column-reverse: פריטים מסודרים מלמטה למעלה (בעמודה).
        ', + 'ro': '

        Broaștele trebuie să ajungă în aceeași ordine ca nuferii folosind flex-direction. Această proprietate CSS definește direcția în care sunt așezate elementele în container și acceptă următoarele valori:

        • row: Elementele sunt așezate la fel ca direcția textului.
        • row-reverse: Elementele sunt așezate opus față de direcția textului.
        • column: Elementele sunt așezate de sus în jos.
        • column-reverse: Elementele sunt așezate de jos în sus.
        ', + 'bg': '

        Жабчетата трябва да се подредят по същия начин както техните листа, използвайки flex-direction. Това CSS свойство определя посоката, в която са разположени елементите в контейнера и приема следните стойности:

        • row: Елементите са разположени по посока на текста.
        • row-reverse: Елементите са разположени обратно на посоката на текста.
        • column: Елементите са разположени от горе надолу.
        • column-reverse: Елементите са разположени от долу нагоре.
        ', + 'de': '

        Die Frösche müssen mit Hilfe von flex-direction in die Reihenfolge der Seerosenblätter gebracht werden. Diese CSS-Eigenschaft legt die Ausrichtung der Elemente in einem Container fest und akzeptiert die folgenden Werte:

        • row: Elemente in Textrichtung ausrichten.
        • row-reverse: Elemente entgegen der Textrichtung ausrichten.
        • column: Elemente von oben nach unten ausrichten.
        • column-reverse: Elemente von unten nach oben ausrichten.
        ', + 'pt-br': '

        Os sapos precisam ficar na mesma ordem das vitórias-régias usando flex-direction. Esta propriedade CSS define a direção em que os itens são posicionados no container e aceita os seguintes valores:

        • row: Itens são posicionados na mesma direção do texto.
        • row-reverse: Itens são posicionados na direção oposta à do texto.
        • column: Itens são posicionados de cima para baixo.
        • column-reverse: Itens são posicionados de baixo para cima.
        ', + 'es': '

        Las ranas necesitan ponerse en el mismo orden que sus hojas de lirio usando flex-direction. Esta propiedad CSS define la dirección de los elementos en el contenedor, y acepta los siguientes valores:

        • row: Elementos son colocados en la misma dirección del texto.
        • row-reverse: Elementos son colocados en la dirección opuesta al texto.
        • column: Elementos se colocan de arriba hacia abajo.
        • column-reverse: Elementos se colocan de abajo hacia arriba.
        ', + 'fr': '

        Les grenouilles doivent se rendre dans le même ordre que leurs nénuphars en utilisant flex-direction. Cette propriété CSS définit la direction dans laquelle les éléments sont placés dans le conteneur, et accepte les valeurs suivantes :

        • row : Les éléments sont disposés dans la même direction que le texte.
        • row-reverse : Les éléments sont disposés dans la direction opposée au texte.
        • column : Les éléments sont disposés de haut en bas.
        • column-reverse : Les éléments sont disposés de bas en haut.
        ', + 'ru': '

        Лягушатам нужно выстроиться в том же порядке, что и лилии, используя flex-direction. Это свойство CSS задает направление, в котором будут расположены элементы в контейнере, и принимает следующие значения:

        • row: элементы размещаются по направлению текста.
        • row-reverse: элементы отображаются в обратном порядке к направлению текста.
        • column: элементы располагаются сверху вниз.
        • column-reverse: элементы располагаются снизу вверх.
        ', + 'fa': '

        قورباغه ها نیاز دارند که روی نیلوفرهای آبی خود قرار بگیرند پس با استفاده از flex-direction این کار را انجام دهید. این خاصیت جهت ایتم ها را تعیین می کند و مقادیر زیر را می پذیرد:

        • row: این مقدار برای چیدمان افقی آیتم ها به کار میرود.
        • row-reverse: این خاصیت مانند خاصیت قبل است با این تفاوت که مکان آیتم ها برعکس می شود.
        • column: این مقدار برای چیدمان عمودی آیتم ها به کار میرود.
        • column-reverse: این خاصیت مانند خاصیت قبل است با این تفاوت که مکان آیتم ها برعکس می شود.
        ', + 'zh-cn': '

        青蛙们需要和他们的荷叶保持对应的顺序。我们可以用flex-direction属性。这个CSS属性定义了元素在容器里摆放的方向，并且接受这些值：

        • row: 元素摆放的方向和文字方向一致。
        • row-reverse: 元素摆放的方向和文字方向相反。
        • column: 元素从上放到下。
        • column-reverse: 元素从下放到上。
        ', + 'zh-tw': '

        青蛙們需要和他們的荷葉保持對應的順序。我們可以用flex-direction屬性。這個CSS屬性定義了元素在容器裏擺放的方向，並且接受這些值：

        • row: 元素擺放的方向和文字方向一致。
        • row-reverse: 元素擺放的方向和文字的方向相反。
        • column: 元素從上放到下。
        • column-reverse: 元素從下放到上。
        ', + 'tr': '

        Kurbağalar, kendi nilüfer yaprakları ile aynı sırada olmalılar. flex-direction kuralını kullanın. Bu CSS kuralı öğelerin hangi yönde yerleştireleceğini belirler ve şu değerleri alır:

        • row: Öğeler yazı yönü ile aynı yönde yerleştirilir.
        • row-reverse: Öğeler yazı yönünün tersi yönünde yerleştirilir.
        • column: Öğeler yukarıdan aşağıya doğru yerleştirilir.
        • column-reverse: Öğeler aşağıdan yukarıya doğru yerleştirilir.
        ', + 'az': '

        Qurbağalar, öz zanbaq yarpağları ilə eyni sırada olmalıdırlar. flex-direction qaydasını istifadə edin. Bu CSS qaydası elementlərin hansı istiqamətdə yerləşdiriləcəyini təyin edir və bu dəyərləri alır:

        • row: Elementlər yazı yönü ilə eyni istiqamətdə yerləşdirilir.
        • row-reverse: Elementlər yazı yönünün tərsi yönündə yerləşdirilir.
        • column: Elementlər yuxarıdan aşağıya doğru yerləşdirilir.
        • column-reverse: Elementlər aşağıdan yuxarıya doğru yerləşdirilir.
        ', + 'it': '

        Le rane devo posizionarsi nello stesso ordine delle ninfee usando la proprietà flex-direction. Questa proprietà definisce la direzione in cui gli elementi verranno posizionati nel contenitore e accetta i seguenti valori:

        • row: Gli elementi sono posizionati nella stessa direzione del testo.
        • row-reverse: Gli elementi sono posizionati nella direzione opposta al testo.
        • column: Gli elementi sono posizionati dall\'alto verso il basso.
        • column-reverse: Gli elementi sono posizionati dal basso verso l\'alto.
        ', + 'ko': '

        개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요. 이번에는 flex-direction을 사용하세요. 이 CSS 속성은 다음의 값들을 인자로 받아 컨테이너 안에서 요소들이 정렬해야 할 방향을 지정합니다:

        • row: 요소들을 텍스트의 방향과 동일하게 정렬합니다.
        • row-reverse: 요소들을 텍스트의 반대 방향으로 정렬합니다.
        • column: 요소들을 위에서 아래로 정렬합니다.
        • column-reverse: 요소들을 아래에서 위로 정렬합니다.
        ', + 'lt': '

        Varlytėms, naudojant flex-direction, reikia išsirikiuoti lygiai taip, kaip išrikiuoti jų lelijos lapai. Ši CSS komanda nusako kryptį, pagal kurią elementai yra sudėliojami supančio elemento viduje ir reaguoja į šias vertes:

        • row: Elementai yra rikiuojami teksto skaitymo kryptimi.
        • row-reverse: Elementai yra rikiuojami atvirkščiai teksto skaitymo krypties.
        • column: Elementai yra rikiuojami iš viršaus į apačią.
        • column-reverse: Elementai yra rikiuojami iš apačios į viršų.
        ', + 'vi': '

        Những chú ếch cần phải đến với các lá bông súng cùng màu của chúng bằng cách sử dụng flex-direction. Từ thuộc tính CSS này xác định hướng hạng mục được đặt trong hộp chứa, và chấp nhận các giá trị sau:

        • row: Các hạng mục được đặt cùng hướng với hướng của từ trong văn bản.
        • row-reverse: Các hạng mục được đặt ngược hướng với hướng của từ trong văn bản.
        • column: Các hạng mục được đặt từ trên xuống dưới.
        • column-reverse: Các hạng mục được đặt từ dưới lên trên.
        ', + 'pl': '

        Żabki muszą znaleźć się w tej samej kolejności co ich listki, pomoże im w tym właściwość flex-direction. Określa ona kierunek w jakim elementy są rozmieszczone w kontenerze i przyjmuje wartości:

        • row: Elementy zostaną rozmieszczone tak jak tekst.
        • row-reverse: Elementy zostaną rozmieszczone odwrotnie do kierunku tekstu.
        • column: Elementy zostaną rozmieszczone od góry do dołu.
        • column-reverse: Elementy zostaną rozmieszczone od dołu do góry.
        ', + 'cs': '

        Žabky se potřebují dostat na lekníny své barvy, pomůže jim vlastnost flex-direction. Tato vlastnost určuje směr, kterým jsou prvky rozmístěny v kontejneru, a akceptuje následující hodnoty:

        • row: Řádky ve směru textu.
        • row-reverse: Řádky proti směru textu.
        • column: Sloupce shora dolů.
        • column-reverse: Sloupce zdola nahoru.
        ', + 'ja': '

        flex-directionを使って、カエルたちをそれぞれの蓮の葉に乗せましょう。このCSSプロパティーはコンテナー内でアイテムが配置される方向を決定します。また以下の値を取ります。

        • row: アイテムは文章と同じ方向に配置されます。
        • row-reverse: アイテムは文章と逆の方向に配置されます。
        • column: アイテムは上から下に向かって配置されます。
        • column-reverse: アイテムは下から上に向かって配置されます。
        ', + 'hu': '

        A békáknak ugyanolyan sorrendbe kell rendeződniük, mint a tündérrózsáik, méghozzá a flex-direction tulajdonság használatával. Ez a CSS tulajdonság definiálja az irányzékot, amely mentén az elemek a konténerbe vannak helyezve, a következő értékek segítségével:

        • row: Az elemek a szöveg irányával megegyezően helyezkednek el.
        • row-reverse: Az elemek a szöveg irányával ellentétes sorrendben helyezkednek el.
        • column: Az elemek fentről lefelé rendeződnek.
        • column-reverse: Az elemek lentről felfelé rendeződnek.
        ', + 'eo': '

        La ranoj bezonas esti en la sama ordo kiel iliaj avkolilifolioj pere de flex-direction. Tiu ĉi CSS-a trajto difinas la direkton ke elementoj estas metataj en la ujon, kaj akceptas la sekvajn valorojn:

        • row: Elementoj estas metataj samkiel la teksta direkto.
        • row-reverse: Elementoj metiĝas male al la teksta direkto.
        • column: Elementoj metatas supre malsupren.
        • column-reverse: Elementoj metatas malsupre supren.
        ', + 'sv': '

        Grodorna behöver ställa sig i samma ordning som blombladen genom att använda flex-direction. Detta attribut definerar vilket håll objekten är placerade i inuti containern och accepterar följande värden:

        • row: Objekten är placerade åt samma håll som vanlig text.
        • row-reverse: Objekten är placerade åt motsat håll som vanlig text.
        • column: Objekten är placerade uppifrån och ner.
        • column-reverse: Objekten är placerade nerifrån och upp.
        ', + 'uk': '

        Жабенята мають бути в тому ж порядку що і їх листя латаття. Використовуй flex-direction - ця CSS властивість визначає напрямок елементів в контейнері та може набувати наступних значень:

        • row: елементи розташовані так само, як напрямок тексту.
        • row-reverse: елементи розташовані протилежно напрямку тексту.
        • column: елементи розташовані з гори до низу.
        • column-reverse: елементи розташовані з низу до гори.
        ', + 'hi': '

        flex-direction की मदद से मेंढकों को लिली के पत्तों को समान क्रम में लाइए। यह CSS प्रॉपर्टी कंटेनर के अन्दर किसी वस्तु की दिशा निर्धारित करती है, एवं निम्न मान स्वीकार करती है:

        • row: वस्तुएं पाठ दिशा के अनुरूप हो जाती है।
        • row-reverse: वस्तुएं पाठ दिशा के अनुरूप हो जाती हैं।
        • column: वस्तुएं लम्ब रूप में उपर से नीचे की ओर हो जाती हैं।
        • column-reverse: वस्तुएं लम्ब रूप में नीचे से उपर की ओर हो जाती हैं।
        ', + 'sr': '

        Поређај жабице као што је редослед локвања користећи flex-direction. Ово CSS својство одређује смер у коме су елементи распоређени у контејнеру и прихвата следеће вредности:

        • row: Елементи су распоређени у смеру текста.
        • row-reverse: Елементи су распоређени супротно од смера текста.
        • column: Елементи су распоређени одозго према доле.
        • column-reverse: Елементи су распоређени одоздо према горе.
        ', + 'bs': '

        Poredaj žabice kao što je redoslijed lokvanja koristeći flex-direction. Ovo CSS svojstvo određuje smjer u kojem su elementi raspoređeni u kontejneru i prihvata sljedeće vrijednosti:

        • row: Elementi su raspoređeni u smjeru teksta.
        • row-reverse: Elementi su raspoređeni suprotno od smjera teksta.
        • column: Elementi su raspoređeni odozgo prema dole.
        • column-reverse: Elementi su raspoređeni odozdo prema gore.
        ', + 'hr': '

        Poredaj žabice kao što je redoslijed lopoča koristeći flex-direction. Ovo CSS svojstvo određuje smjer u kojem su elementi raspoređeni u kontejneru i prihvaća sljedeće vrijednosti:

        • row: Elementi su raspoređeni u smjeru teksta.
        • row-reverse: Elementi su raspoređeni suprotno od smjera teksta.
        • column: Elementi su raspoređeni odozgo prema dolje.
        • column-reverse: Elementi su raspoređeni odozdo prema gore.
        ', + 'nl': '

        De kikkers moeten in dezelfde volgorde als hun lelieblaadjes terecht komen, maak hiervoor gebruik van flex-direction. Deze CSS eigenschap bepaald de richting in dewelke de elementen in hun container geplaatst worden, en aanvaard de volgende waarden:

        • row: Elementen worden geplaatst in dezelfde richting als deze van de tekst.
        • row-reverse: Elementen worden geplaatst in de tegenovergestelde richting van de tekst.
        • column: Elementen worden onder elkaar geplaatst.
        • column-reverse: Elementen worden boven elkaar geplaatst.
        ', + 'ta': '

        flex-direction பயன்படுத்தி தவளைகள் தங்கள் இலைகளை அதே வரிசையில் பெற வேண்டும்.இந்த CSS property எந்த திசையில் பொருட்கள் வைக்கப்படுகின்றன என வரையறுக்கிறது, மற்றும் பின்வரும் மதிப்புகளை ஏற்றுக்கொள்கிறது:

        • row: பொருட்கள் (Text)உரை உள்ள அதே திசையில் வைக்கப்படும்.
        • row-reverse: பொருட்கள் (Text)உரைக்கு எதிர் திசையில் வைக்கப்படும்.
        • column: பொருட்கள் மேலிருந்து கீழாக வைக்கப்படும்.
        • column-reverse: பொருட்கள் கீழிருந்து மேலாக வைக்கப்படும்.
        ', + 'te': '

        కప్పలు flex-direction ను ఉపయోగించి వాటి లిల్లీప్యాడ్ల మాదిరిగానే పొందాలి. ఈ CSS ఆస్తి కంటైనర్‌లో ఉంచిన దిశ అంశాలను నిర్వచిస్తుంది మరియు ఈ క్రింది విలువలను అంగీకరిస్తుంది:

        • row: వస్తువులు వచన దిశకు సమానంగా ఉంచబడతాయి.
        • row-reverse: వస్తువులు వచన దిశకు ఎదురుగా ఉంచబడతాయి.
        • column: వస్తువులు పై నుండి క్రిందికి ఉంచబడతాయి.
        • column-reverse: వస్తువులు దిగువ నుండి పైకి ఉంచబడతాయి.
        ', + 'ml': '

        flex-direction ഉപയോഗിച്ച് താവളകൾക്കു അവരുടെ താമര ഇലകളുടെ അതെ ഓർഡറിൽ കൊണ്ടുവരുക . ഈ CSS വസ്തു, കണ്ടെയ്നറിൽ ദിശ ഇനങ്ങൾ സ്ഥാപിച്ചിരിക്കുന്നു എന്ന് നിർവ്വചിക്കുകയും ഇനിപ്പറയുന്ന മൂല്യങ്ങൾ അംഗീകരിക്കുകയും ചെയ്യും:

        • row: ഇനങ്ങൾ വാചക ദിശ പോലെ തന്നെ വയ്ക്കുന്നു.
        • row-reverse: ഇനങ്ങൾ ടെക്സ്റ്റ് ദിശയ്ക്ക് വിപരീതമാണ്.
        • column: ഇനങ്ങൾ മുകളിൽ താഴെയായി.
        • column-reverse: ഇനങ്ങൾ മുകളിൽ മുകളിലായി സ്ഥാപിക്കുന്നു.
        ', + 'el': '

        Οι βάτραχοι πρέπει να μπουν στην ίδια σειρά με τα νούφαρά τους χρησιμοποιώντας το flex-direction. Αυτή η ιδιότητα CSS καθορίζει την κατεύθυνση με την οποία τοποθετούνται τα αντικείμενα στο container, και αποδέχεται τις εξής αξίες:

        • row: Τα αντικείμενα τοποθετούνται στην ίδια κατεύθυνση με το κείμενο.
        • row-reverse: Τα αντικείμενα τοποθετούνται σε κατεύθυνση αντίθετη από το κείμενο.
        • column: Τα αντικείμενα τοποθετούνται από πάνω προς τα κάτω.
        • column-reverse: Τα αντικείμενα τοποθετούνται από κάτω προς τα πάνω.
        ', + 'mk': '

        Жабите треба да се подредат во ист редослед како и нивните листови со користење на flex-direction. Ова CSS својство ја определува насоката во која елементите се поставени во контејнерот, и ги прима следните вредности:

        • row: Елементите се распоредени исто како и насоката на текстот.
        • row-reverse: Елементите се распоредени спротивно од насоката на текстот.
        • column: Елементите се распоредени од горе надолу.
        • column-reverse: Елементите се распоредени од долу нагоре.
        ', + 'lv': '

        Vardulēniem ir jāsavietojas tādā pašā secībā kā to ūdensrozes. To var izdarīt, lietojot flex-direction metodi. Šī CSS metode nosaka to, kādā virzienā konteinerā ir novietoti elementi un pieņem sekojošas vērtības :

        • row: Elementi ir novietoti tādā pašā virzienā kā teksts.
        • row-reverse: Elementi ir novietoti tekstam pretējā virzienā.
        • column: Elementi ir novietoti virzienā no augšas uz leju.
        • column-reverse: Elementi ir novietoti virzienā no lejas uz augšu.
            • ', + 'id': '

            Katak harus memiliki urutan yang sama dengan lilypad mereka menggunakan flex-direction. Properti CSS ini mendefinisikan arah objek yang ditempatkan dalam wadah, dan menerima nilai-nilai berikut:

            • row: Objek ditempatkan sama dengan arah teks.
            • row-reverse: Objek ditempatkan berlawanan dengan arah teks.
            • column: Objek ditempatkan dari atas ke bawah.
            • column-reverse: Objek ditempatkan dari bawah ke atas.
            ', + 'ar': '

            الضفادع تريد القفز الى اوراق الزنبق بالترتيب باستخدام flex-direction. تحدد خاصية الـCSS هذه اتجاه العناصر الموضوعة في الحاوية, وتقبل هذه القيم:

            • row: يتم وضع العناصر بنفس اتجاه النص.
            • row-reverse: يتم وضع العناصر بعكس اتجاه النص.
            • column: يتم وضع العناصر من أعلى إلى أسفل.
            • column-reverse: يتم وضع العناصر من أسفل إلى أعلى.
            ', + 'ca': '

            Les granotes necessiten posar-se en el mateix ordre que els seus nenúfars flex-direction. Aquesta propietat CSS defineix la direcció dels elements en el contenidor, i accepta els següents valors:

            • row: Els elements es col·loquen en la mateixa direcció del text.
            • row-reverse: Els elements es col·loquen en la direcció oposada al text.
            • column: Els elements es col·loquen de dalt a baix.
            • column-reverse: Els elements es col·loquen de baix a dalt.
            ', + 'da': '

            Frøerne skal stilles i samme rækkefølge som deres åkander med flex-direction. Denne CSS-egenskab fastsætter den retning, hvori elementer placeres i beholderen, og kan tage følgende værdier:

            • row: Elementer placeres i samme retning som tekst.
            • row-reverse: Elementer placeres i modsat retning af tekst.
            • column: Elementer placeres fra toppen til bunden.
            • column-reverse: Elementer placeres fra bunden til toppen.
            ', + 'et': '

            Konnad peavad saama samasse järjekorda nagu on nende vesiroosilehed kasutades flex-direction. See CSS omadus ütleb, millises suunas elemendid konteineri sees paigutatakse, selle puhul saab kasutada järgmisi väärtusi:

            • row: Elemendid on paigutatud samas suunas mis tekst.
            • row-reverse: Elemendid on paigutatud tekstiga vastassuunas.
            • column: Elemendid on paigutatud ülevalt alla.
            • column-reverse: Elemendid on paigutatud alt üles.
            ', + 'fi': '

            Sammakoiden täytyy asettua samaan järjestykseen kuin lumpeenlehdet flex-direction-ominaisuuden avulla. Tämä CSS-ominaisuus määrittää elementtien järjestyksen säilössä. Sille voi antaa jonkin seuraavista arvoista:

            • row: Elementit järjestetään vaakasuuntaan tekstin kulkusuunnan mukaisesti.
            • row-reverse: Elementit järjestetään vaakasuuntaan tekstin kulkusuunnan vastaisesti.
            • column: Elementit järjestetään pystysuuntaan ylhäältä alas.
            • column-reverse: Elementit järjestetään pystysuuntaan alhaalta ylös.
            ', + 'gl': '

            As rás teñen que colocarse na mesma orde cós seus nenúfares empregando flex-direction. Esta propiedade CSS define a dirección na que se dispoñen os elementos no contedor, e acepta os seguintes valores:

            • row: Os elementos colócanse na mesma dirección có texto.
            • row-reverse: Os elementos colócanse na dirección oposta ao texto.
            • column: Os elementos dispóñense de arriba abaixo.
            • column-reverse: Os elementos dispóñense de abaixo arriba.
            ', + 'th': '

            เจ้ากบต้องไปตามลำดับสีของใบบัว โดยใช้คำสั่ง flex-direction. คุณสมบัติ CSS นี้กำหนดทิศทางที่ items จะถูกวางใน container, และรับค่าดังต่อไปนี้:

            • row: items จะถูกวางตามทิศทางของตัวหนังสือ
            • row-reverse: items จะถูกวางไปในทิศทางตรงข้ามกับตัวหนังสือ
            • column: items จะถูกวางจากบนลงล่าง
            • column-reverse: items จะถูกวางจากล่างขึ้นบน
            ', + 'mn': '

            Мэлхийнүүдийг байгаа дарааллаар нь flex-direction-г ашиглан сараана цэцэгс дээр нь хөтлөөрэй. Энэ CSS проперти нь items-г контейнерт байрлуулах чиглэлийг тодорхойлохдоо дараах утгуудыг хүлээн зөвшөөрнө:

            • row: items-г текстийн чиглэлтэй адил байрлуулна.
            • row-reverse: items-г текстийн чиглэлийн эсрэг чиглэлд байрлуулна.
            • column: itemcийг дээрээс доош байрлуулна.
            • column-reverse: itemcийг доороос дээш байрлуулна.
            ' + }, + board: 'gyr', + style: { 'flex-direction': 'row-reverse' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 2', + instructions: { + 'en': '

            Help the frogs find their column of lilypads using flex-direction. This CSS property defines the direction items are placed in the container, and accepts the following values:

            • row: Items are placed the same as the text direction.
            • row-reverse: Items are placed opposite to the text direction.
            • column: Items are placed top to bottom.
            • column-reverse: Items are placed bottom to top.
            ', + 'he': '

            עזרו לצפרדעים להגיע לשורה שלהם בשימוש ב-flex-direction. התכונת CSS הזו מגדירה את כיוון הסידור של הפריטים בקונטיינר, ומקבלת את הערכים הבאים:

            • row: פריטים מסודרים כמו בכיוון שהוגדר לטקסט.
            • row-reverse: פריטים מסודרים ההפך מהכיוון שהוגדר לטקסט.
            • column: פריטים מסודרים מלמעלה למטה (בעמודה).
            • column-reverse: פריטים מסודרים מלמטה למעלה (בעמודה).
            ', + 'ro': '

            Ajută broaștele să găsească coloana lor de nuferi folosind flex-direction. Această proprietate CSS definește direcția în care sunt așezate elementele în container și acceptă următoarele valori:

            • row: Elementele sunt așezate la fel ca direcția textului.
            • row-reverse: Elementele sunt așezate opus față de direcția textului.
            • column: Elementele sunt așezate de sus în jos.
            • column-reverse: Elementele sunt așezate de jos în sus.
            ', + 'bg': '

            Помогни на жабчетата да намерят своето листо в колоната, използвайки flex-direction. Това CSS свойство определя посоката, в която са разположени елементите в контейнера и приема следните стойности:

            • row: Елементите са разположени по посока на текста.
            • row-reverse: Елементите са разположени обратно на посоката на текста.
            • column: Елементите са разположени от горе надолу.
            • column-reverse: Елементите са разположени от долу нагоре.
            ', + 'de': '

            Hilf den Fröschen dabei, die Seerosenblätter zu erreichen, indem du flex-direction verwendest. Diese CSS-Eigenschaft legt die Richtung fest, in der die Elemente im Container platziert werden. Sie akzeptiert die folgenden Werte:

            • row: Elemente in Textrichtung ausrichten.
            • row-reverse: Elemente entgegen der Textrichtung ausrichten.
            • column: Elemente von oben nach unten ausrichten.
            • column-reverse: Elemente von unten nach oben ausrichten.
            ', + 'pt-br': '

            Ajude os sapos a encontrar sua coluna de vitórias-régias usando flex-direction. Esta propriedade CSS define a direção em que os itens são posicionados no container e aceita os seguintes valores:

            • row: Itens são posicionados na mesma direção do texto.
            • row-reverse: Itens são posicionados na direção oposta à do texto.
            • column: Itens são posicionados de cima para baixo.
            • column-reverse: Itens são posicionados de baixo para cima.
            ', + 'es': '

            Ayuda a las ranas a encontrar su hoja de lirio en la columna usando flex-direction. Esta propiedad CSS define la dirección de los elementos en el contenedor, y acepta los siguientes valores:

            • row: Elementos son colocados en la misma dirección del texto.
            • row-reverse: Elementos son colocados en la dirección opuesta al texto.
            • column: Elementos se colocan de arriba hacia abajo.
            • column-reverse: Elementos se colocan de abajo hacia arriba.
            ', + 'fr': '

            Aidez les grenouilles à trouver leurs colonnes de nénuphars en utilisant flex-direction. Cette propriété CSS définit la direction dans laquelle les éléments sont placés dans le conteneur, et accepte les valeurs suivantes :

            • row : Les éléments sont disposés dans la même direction que le texte.
            • row-reverse : Les éléments sont disposés dans la direction opposée au texte.
            • column : Les éléments sont disposés de haut en bas.
            • column-reverse : Les éléments sont disposés de bas en haut.
            ', + 'ru': '

            Помоги лягушатам расположиться на своих лилиях, используя flex-direction. Это свойство CSS задает направление, в котором располагаются элементы в контейнере, и принимает следующие значения:

            • row: элементы размещаются по направлению текста.
            • row-reverse: элементы отображаются в обратном порядке к направлению текста.
            • column: элементы распологаются сверху вниз.
            • column-reverse: элементы распологаются снизу вверх.
            ', + 'fa': '

            به قورباغه ها کمک کنید تا به صورت ستونی روی نیلوفرهای آبی قرار می گیرند با استفاده از flex-direction این کار را انجام دهید. این خاصیت جهت قرار گیری آیتم ها را مشخص می کند, مقادیر این خاصیت عبارتند از :

            • row: این مقدار برای چیدمان افقی آیتم ها به کار میرود.
            • row-reverse: این خاصیت مانند خاصیت قبل است با این تفاوت که مکان آیتم ها برعکس می شود.
            • column: این مقدار برای چیدمان عمودی آیتم ها به کار میرود.
            • column-reverse: این خاصیت مانند خاصیت قبل است با این تفاوت که مکان آیتم ها برعکس می شود.
            ', + 'zh-cn': '

            使用flex-direction属性，帮助青蛙们找到它们该去的列。这个CSS属性定义了元素在容器里摆放的方向，并且接受这些值：

            • row: 元素摆放的方向和文字方向一致。
            • row-reverse: 元素摆放的方向和文字方向相反。
            • column: 元素从上放到下。
            • column-reverse: 元素从下放到上。
            ', + 'zh-tw': '

            使用flex-direction屬性，幫助青蛙們找到它們該去的行。這個CSS屬性定義了元素在容器裏擺放的方向，並且接受這些值：

            • row: 元素擺放的方向和文字方向一致。
            • row-reverse: 元素擺放的方向和文字的方向相反。
            • column: 元素從上放到下。
            • column-reverse: 元素從下放到上。
            ', + 'tr': '

            flex-direction kuralını kullanarak, kurbağaların kendi nilüfer yapraklarını bulmasına yardımcı olun. Bu CSS kuralı öğelerin hangi yönde yerleştireleceğini belirler ve şu değerleri alır:

            • row: Öğeler yazı yönü ile aynı yönde yerleştirilir.
            • row-reverse: Öğeler yazı yönünün tersi yönünde yerleştirilir.
            • column: Öğeler yukarıdan aşağıya doğru yerleştirilir.
            • column-reverse: Öğeler aşağıdan yukarıya doğru yerleştirilir.
            ', + 'az': '

            flex-direction qaydasını istifadə edərək, qurbağaların öz zanbaq yarpaqlarını tapmasına kömək edin. Bu CSS qaydası elementlərin hansı yöndə yerləşdiriləcəyini təyin edir və bu dəyərləri alır:

            • row: Elementlər yazı yönü ilə eyni yöndə yerləşdirilir.
            • row-reverse: Elementlər yazı yönünün əksi yönündə yerləşdirilir.
            • column: Elementlər yuxarıdan aşağıya doğru yerləşdirilir.
            • column-reverse: Elementlər aşağıdan yuxarıya doğru yerləşdirilir.
            ', + 'it': '

            Aiuta le rane a trovare la loro ninfea usando flex-direction. Questa proprietà CSS definisce la direzione in cui gli elementi verranno sistemati nel contenitore ed accetta i seguenti valori:

            • row: Gli elementi sono posizionati seguendo la stessa direzione del testo.
            • row-reverse: Gli elementi sono posizionati nella direzione opposta del testo.
            • column: Gli elementi sono posizionati dall\'alto verso il basso.
            • column-reverse: Gli elementi sono posizionati dal basso verso l\'alto.
            ', + 'ko': '

            flex-direction을 사용하여 개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요. 이 CSS 속성은 다음의 값들을 인자로 받아 컨테이너 안에서 요소들이 정렬해야 할 방향을 지정합니다:

            • row: 요소들을 텍스트의 방향과 동일하게 정렬합니다.
            • row-reverse: 요소들을 텍스트의 반대 방향으로 정렬합니다.
            • column: 요소들을 위에서 아래로 정렬합니다.
            • column-reverse: 요소들을 아래에서 위로 정렬합니다.
            ', + 'lt': '

            Naudodami flex-direction padėkite varlytėms rasti stulpelį, kuriame yra jų lelijos lapai. Ši CSS komanda nusako kryptį, pagal kurią elementai yra sudėliojami supančio elemento viduje ir reaguoja į šias vertes:

            • row: Elementai yra rikiuojami teksto skaitymo kryptimi.
            • row-reverse: Elementai yra rikiuojami atvirkščiai teksto skaitymo krypties.
            • column: Elementai yra rikiuojami iš viršaus į apačią.
            • column-reverse: Elementai yra rikiuojami iš apačios į viršų.
            ', + 'vi': '

            Giúp đỡ những chú ếch tìm thấy các lá bông súng được sắp xếp theo hàng dọc sử dụng flex-direction. Từ thuộc tính CSS này xác định hướng hạng mục được đặt trong hộp chứa, và chấp nhận các giá trị sau:

            • row: Các hạng mục được đặt cùng hướng với hướng của từ trong văn bản.
            • row-reverse: Các hạng mục được đặt ngược hướng với hướng của từ trong văn bản.
            • column: Các hạng mục được đặt từ trên xuống dưới.
            • column-reverse: Các hạng mục được đặt từ dưới lên trên.
            ', + 'pl': '

            Pomóż żabkom odnaleźć ich kolumny przy pomocy flex-direction. Ta właściwość określa kierunek w jakim elementy w kontenerze są ustawione. Przyjmuje wartości:

            • row: Elementy są rozmieszczone w kierunku tekstu.
            • row-reverse: Elementy są rozmieszczone w kierunku przeciwnym do tekstu.
            • column: Elementy są rozmieszczone od góry do dołu.
            • column-reverse: Elementy są rozmieszczone od dołu do góry.
            ', + 'cs': '

            Pomozte žabkám dostat se na sloupec leknínů pomocí flex-direction. Tato vlastnost určuje směr, kterým jsou prvky rozmístěny v kontejneru, a akceptuje následující hodnoty:

            • row: Řádky ve směru textu.
            • row-reverse: Řádky proti směru textu.
            • column: Sloupce shora dolů.
            • column-reverse: Sloupce zdola nahoru.
            ', + 'ja': '

            flex-directionを使って、カエルたちが自分の蓮の葉を見つけるのを助けてあげましょう。このCSSプロパティーはコンテナー内でアイテムが配置される方向を決定します。また以下の値を取ります。

            • row: アイテムは文章と同じ方向に配置されます。
            • row-reverse: アイテムは文章と逆の方向に配置されます。
            • column: アイテムは上から下に向かって配置されます。
            • column-reverse: アイテムは下から上に向かって配置されます。
            ', + 'hu': '

            Segíts a békáknak megtalálni a tündérrózsáikat a flex-direction használatával. Ez a CSS tulajdonság definiálja az irányzékot, amely mentén az elemek a konténerbe vannak helyezve, a következő értékek segítségével:

            • row: Az elemek a szöveg irányával megegyezően helyezkednek el.
            • row-reverse: Az elemek a szöveg irányával ellentétes sorrendben helyezkednek el.
            • column: Az elemek fentről lefelé rendeződnek.
            • column-reverse: Az elemek lentről felfelé rendeződnek.
            ', + 'eo': '

            Helpu la ranojn trovi ilian kolumnon de avkolilifolioj pere de flex-direction. Tiu ĉi CSS-a trajto difinas la direkton ke elementoj estas metataj en la ujon, kaj akceptas la sekvajn valorojn:

            • row: Elementoj estas metataj samkiel la teksta direkto.
            • row-reverse: Elementoj metiĝas male al la teksta direkto.
            • column: Elementoj metatas supre malsupren.
            • column-reverse: Elementoj metatas malsupre supren.
            ', + 'sv': '

            Hjälp grodorna att hitta sina blomblad genom att använda flex-direction. Detta attribut definerar vilket håll objekten är placerade i inuti containern och accepterar följande värden:

            • row: Objekten är placerade åt samma håll som vanlig text.
            • row-reverse: Objekten är placerade åt motsat håll som vanlig text.
            • column: Objekten är placerade uppifrån och ner.
            • column-reverse: Objekten är placerade nerifrån och upp.
            ', + 'uk': '

            Допоможіть жабенятам потрапити на свої вертикальні листки латаття, використав flex-direction. Ця CSS властивість визначає напрямок елементів в контейнері та може набувати наступних значень:

            • row: елементи розташовані так само, як напрямок тексту.
            • row-reverse: елементи розташовані протилежно напрямку тексту.
            • column: елементи розташовані з гори до низу.
            • column-reverse: елементи розташовані з низу до гори.
            ', + 'hi': '

            flex-direction की मदद से मेंढकों को उनके कॉलम तक पहुंचाइये। यह CSS प्रॉपर्टी कंटेनर के अन्दर किसी वस्तु की दिशा निर्धारित करती है, एवं निम्न मान स्वीकार करती है:

            • row: वस्तुएं पाठ दिशा के अनुरूप हो जाती है।
            • row-reverse: वस्तुएं पाठ दिशा के अनुरूप हो जाती हैं।
            • column: वस्तुएं लम्ब रूप में उपर से नीचे की ओर हो जाती हैं।
            • column-reverse: वस्तुएं लम्ब रूप में नीचे से उपर की ओर हो जाती हैं।
            ', + 'sr': '

            Помози жабицама да нађу своју колону локвања користећи flex-direction. Ово CSS својство дефинише смер у коме су елементи распоређени у контејнеру и прихвата следеће вредности:

            • row: Елементи су распоређени у смеру текста.
            • row-reverse: Елементи су распоређени супротно од смера текста.
            • column: Елементи су распоређени одозго према доле.
            • column-reverse: Елементи су распоређени одоздо према горе.
            ', + 'bs': '

            Pomozi žabicama da nađu svoju kolonu listova koristeći flex-direction. Ovo CSS svojstvo definiše smjer u kojem su elementi raspoređeni u kontejneru i prihvata sljedeće vrijednosti:

            • row: Elementi su raspoređeni u smjeru teksta.
            • row-reverse: Elementi su raspoređeni suprotno od smjera teksta.
            • column: Elementi su raspoređeni odozgo prema dolje.
            • column-reverse: Elementi su raspoređeni odozdo prema gore.
            ', + 'hr': '

            Pomozi žabicama da nađu svoju kolonu listova koristeći flex-direction. Ovo CSS svojstvo definira smjer u kojem su elementi raspoređeni u kontejneru i prihvaća sljedeće vrijednosti:

            • row: Elementi su raspoređeni u smjeru teksta.
            • row-reverse: Elementi su raspoređeni suprotno od smjera teksta.
            • column: Elementi su raspoređeni odozgo prema dolje.
            • column-reverse: Elementi su raspoređeni odozdo prema gore.
            ', + 'nl': '

            Help de kikkers naar de juiste kolom lelieblaadjes door gebruik te maken van flex-direction. Deze CSS eigenschap bepaald de richting in dewelke de elementen in hun container geplaatst worden, en aanvaard de volgende waarden:

            • row: Elementen worden geplaatst in dezelfde richting als deze van de tekst.
            • row-reverse: Elementen worden geplaatst in de tegenovergestelde richting van de tekst.
            • column: Elementen worden onder elkaar geplaatst.
            • column-reverse: Elementen worden boven elkaar geplaatst.
            ', + 'ta': '

            flex-direction பயன்படுத்தி தவளைகள் தங்கள் இலைகளை அதே வரிசையில் பெற வேண்டும்.இந்த CSS property எந்த திசையில் பொருட்கள் வைக்கப்படுகின்றன என வரையறுக்கிறது, மற்றும் பின்வரும் மதிப்புகளை ஏற்றுக்கொள்கிறது:

            • row: பொருட்கள் (Text)உரை உள்ள அதே திசையில் வைக்கப்படும்.
            • row-reverse: பொருட்கள் (Text)உரைக்கு எதிர் திசையில் வைக்கப்படும்.
            • column: பொருட்கள் மேலிருந்து கீழாக வைக்கப்படும்.
            • column-reverse: பொருட்கள் கீழிருந்து மேலாக வைக்கப்படும்.
            ', + 'te': '

            కప్పలు flex-direction ను ఉపయోగించి లిల్లీప్యాడ్ల కాలమ్‌ను కనుగొనడంలో సహాయపడండి. ఈ CSS ఆస్తి కంటైనర్‌లో ఉంచిన దిశ అంశాలను నిర్వచిస్తుంది మరియు ఈ క్రింది విలువలను అంగీకరిస్తుంది:

            • row: వస్తువులు వచన దిశకు సమానంగా ఉంచబడతాయి.
            • row-reverse: వస్తువులు వచన దిశకు ఎదురుగా ఉంచబడతాయి.
            • column: వస్తువులు పై నుండి క్రిందికి ఉంచబడతాయి.
            • column-reverse: వస్తువులు దిగువ నుండి పైకి ఉంచబడతాయి.
            ', + 'ml': '

            flex-direction ഉപയോഗിച്ച് തവളകളെ അവരവരുടെ താമര ഇലകളിക് എത്തിക്കുക . ഈ CSS വസ്തു, കണ്ടെയ്നറിൽ ദിശ ഇനങ്ങൾ സ്ഥാപിച്ചിരിക്കുന്നു എന്ന് നിർവ്വചിക്കുകയും ഇനിപ്പറയുന്ന മൂല്യങ്ങൾ അംഗീകരിക്കുകയും ചെയ്യും:

            • row: ഇനങ്ങൾ വാചക ദിശ പോലെ തന്നെ വയ്ക്കുന്നു.
            • row-reverse: ഇനങ്ങൾ ടെക്സ്റ്റ് ദിശയ്ക്ക് വിപരീതമാണ്.
            • column: ഇനങ്ങൾ മുകളിൽ താഴെയായി.
            • column-reverse: ഇനങ്ങൾ മുകളിൽ മുകളിലായി സ്ഥാപിക്കുന്നു.
            ', + 'el': '

            Βοηθήστε τους βατράχους να φτάσουν στην στήλη με τα νούφαρά τους χρησιμοποιώντας το flex-direction. Αυτή η ιδιότητα CSS καθορίζει την κατεύθυνση με την οποία τοποθετούνται τα αντικείμενα στο container, και αποδέχεται τις εξής αξίες:

            • row: Τα αντικείμενα τοποθετούνται στην ίδια κατεύθυνση με το κείμενο.
            • row-reverse: Τα αντικείμενα τοποθετούνται σε κατεύθυνση αντίθετη από το κείμενο.
            • column: Τα αντικείμενα τοποθετούνται από πάνω προς τα κάτω.
            • column-reverse: Τα αντικείμενα τοποθετούνται από κάτω προς τα πάνω.
            ', + 'mk': '

            Помогнете им на жабите да ја најдат нивната колона од листови со користење на flex-direction. Ова CSS својство ја определува насоката во која елементите се поставени во контејнерот, и ги прима следните вредности:

            • row: Елементите се распоредени исто како и насоката на текстот.
            • row-reverse: Елементите се распоредени спротивно од насоката на текстот.
            • column: Елементите се распоредени од горе надолу.
            • column-reverse: Елементите се распоредени од долу нагоре.
            ', + 'lv': '

            Lietojot flex-direction, palīdzi katram vardulēnam atrast savu ūdensrozi. Šī CSS metode nosaka to, kādā virzienā konteinerā ir novietoti elementi un pieņem sekojošas vērtības :

            • row: Elementi ir novietoti tādā pašā virzienā kā teksts.
            • row-reverse: Elementi ir novietoti tekstam pretējā virzienā.
            • column: Elementi ir novietoti virzienā no augšas uz leju.
            • column-reverse: Elementi ir novietoti virzienā no lejas uz augšu.
                • ', + 'id': '

                Bantu katak menemukan kolom lilypads mereka menggunakan flex-direction. Properti CSS ini mendefinisikan arah objek yang ditempatkan dalam wadah, dan menerima nilai-nilai berikut:

                • row: Objek ditempatkan sama dengan arah teks.
                • row-reverse: Objek ditempatkan berlawanan dengan arah teks.
                • column: Objek ditempatkan dari atas ke bawah.
                • column-reverse: Objek ditempatkan dari bawah ke atas.
                ', + 'ar': '

                ساعد الضفادع لإيجاد اوراق الزنبق المرتبة عاموديًا باستخدام flex-direction. تحدد خاصية الـCSS هذه اتجاه العناصر الموضوعة في الحاوية, وتقبل هذه القيم:

                • row: يتم وضع العناصر بنفس اتجاه النص.
                • row-reverse: يتم وضع العناصر بعكس اتجاه النص.
                • column: يتم وضع العناصر من أعلى إلى أسفل.
                • column-reverse: يتم وضع العناصر من أسفل إلى أعلى.
                ', + 'ca': '

                Ajuda les granotes a trobar el seu nenúfar de la columna utilitzant flex-direction. Aquesta propietat CSS defineix la direcció dels elements en el contenidor, i accepta els següents valors:

                • row: Els elements es col·loquen en la mateixa direcció del text.
                • row-reverse: Els elements es col·loquen en la direcció oposada al text.
                • column: Els elements es col·loquen de de dalt a baix.
                • column-reverse: Els elements es col·loquen de baix a dalt.
                ', + 'da': '

                Hjælp frøerne med at finde deres kolonne af åkander med flex-direction. Denne CSS-egenskab fastsætter den retning, hvori elementer placeres i beholderen, og kan tage følgende værdier:

                • row: Elementer placeres i samme retning som tekst.
                • row-reverse: Elementer placeres i modsat retning af tekst.
                • column: Elementer placeres fra toppen til bunden.
                • column-reverse: Elementer placeres fra bunden til toppen.
                ', + 'et': '

                Aita konnadel leda oma veerg vesiroosilehtedel kasutades flex-direction. See CSS omadus ütleb, millises suunas elemendid konteineri sees paigutatakse, selle puhul saab kasutada järgmisi väärtusi:

                • row: Elemendid on paigutatud samas suunas mis tekst.
                • row-reverse: Elemendid on paigutatud tekstiga vastassuunas.
                • column: Elemendid on paigutatud ülevalt alla.
                • column-reverse: Elemendid on paigutatud alt üles.
                ', + 'fi': '

                Auta sammakoita löytämään pystysuunnassa kelluvat lumpeenlehdet flex-direction-ominaisuuden avulla. Tämä CSS-ominaisuus määrittää elementtien järjestyksen säilössä. Sille voi antaa jonkin seuraavista arvoista:

                • row: Elementit järjestetään vaakasuuntaan tekstin kulkusuunnan mukaisesti.
                • row-reverse: Elementit järjestetään vaakasuuntaan tekstin kulkusuunnan vastaisesti.
                • column: Elementit järjestetään pystysuuntaan ylhäältä alas.
                • column-reverse: Elementit järjestetään pystysuuntaan alhaalta ylös.
                ', + 'gl': '

                Axuda ás rás a atopar a súa columna de nenúfares con flex-direction.

                Esta propiedade CSS define a dirección na que se colocan os elementos no contedor, e acepta os seguintes valores:

                • row: Os elementos colócanse na mesma dirección có texto.
                • row-reverse: Os elementos colócanse na dirección oposta ao texto.
                • column: Os elementos dispóñense de arriba abaixo.
                • column-reverse: Os elementos dispóñense de abaixo arriba.
                ', + 'th': '

                ช่วยเจ้ากบหาคอลัมน์ของใบบัว ด้วยคำสั่ง flex-direction คุณสมบัติ CSS นี้กำหนดทิศทางที่ items จะถูกวางใน container, และรับค่าดังต่อไปนี้:

                • row: items จะถูกวางตามทิศทางของตัวหนังสือ
                • row-reverse: items จะถูกวางไปในทิศทางตรงกันข้ามกับตัวหนังสือ
                • column: items จะถูกวางจากบนลงล่าง
                • column-reverse: items จะถูกวางจากล่างขึ้นบน
                ', + 'mn': '

                flex-direction-г ашиглан мэлхийнүүдэд сараана цэцэгсийн баганийг олоход нь туслаарай. Энэ CSS проперти нь items контейнерт хэрхэн байрлах чиглэлийг тодорхойлохдоо дараах утгуудыг хүлээн авна:

                • row: items-г текстийн чиглэлтэй адил байрлуулна.
                • row-reverse: items-г текстийн чиглэлийн эсрэг чиглэлд байрлуулна.
                • column: itemcийг дээрээс доош байрлуулна.
                • column-reverse: itemcийг доороос дээш байрлуулна.
                ' + }, + board: 'gyr', + style: { 'flex-direction': 'column' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 3', + instructions: { + 'en': '

                Help the frogs get to their own lilypads. Although they seem close, it will take both flex-direction and justify-content to get them there.

                Notice that when you set the direction to a reversed row or column, start and end are also reversed.

                ', + 'he': '

                עזרו לצפרדעים להגיע לעלים שלהן. למרות שהן נראות קרובות, זה מצריך שימוש ב-flex-direction וב-justify-content כדי להגיע אליהם.

                שימו לב שכשאתם משנים את הכיוון לכיוון ההפוך, ההגדרה של start ו-end מתחלפות גם הן.

                ', + 'ro': '

                Ajută broaștele să ajungă la nuferii lor. Cu toate că par aproape, va fi nevoie de flex-direction și justify-content pentru a le duce acolo.

                Observă că atunci când setezi direcția ca rând sau coloană inversat(ă), începutul și sfârșitul sunt și ele inversate.

                ', + 'bg': '

                Помогни на жабчетата да достигнат до своите листа. Въпреки че изглеждат близо, ще трябва да използвате и flex-direction, и justify-content, за да достигнете до там.

                Забележете, че когато използвате обърнат ред или колона (row-reverse или column-reverse), началото и края (flex-start и flex-end) също трябва да бъдат обърнати.

                ', + 'de': '

                Hilf den Fröschen, ihr Seerosenblatt zu erreichen. Obwohl sie nah dran sind, benötigst du sowohl flex-direction, als auch justify-content, um sie ans Ziel zu führen.

                Hinweis: Wenn du eine umgekehrte Ausrichtung verwendest, sind Start und Ende auch umgedreht.

                ', + 'pt-br': '

                Ajude os sapos a encontrar suas próprias vitórias-régias. Elas parecem estar próximas, mas você precisará de ambas propriedades, flex-direction e justify-content, para levá-los lá.

                Note que quando você define a direção para uma linha ou coluna reversa, start e end também são reversos.

                ', + 'es': '

                Ayuda a las ranas a llegar a sus hojas de lirio. A pesar de que ellas parecen estar cerca, necesitarás usar flex-direction y justify-content para llegar hasta allí.

                Nota que cuando estableces la dirección a una fila invertida o columna, el inicio y el final también se invierten.

                ', + 'fr': '

                Aidez les grenouilles à arriver à leur propre nénuphar. Bien qu\'elles semblent près, il faudra autant flex-direction que justify-content pour y arriver.

                Remarquez que quand vous mettez la direction inversée, le début et la fin sont aussi inversés.

                ', + 'ru': '

                Помоги лягушатам попасть на свои лилии. Хоть и кажется, что они почти на своих местах, всё же придётся применить и flex-direction, и justify-content, чтобы поместить их на свои лилии.

                Заметь, что когда ты устанавливаешь направление в обратном порядке для ряда или колонки, начало (start) и конец (end) тоже меняются местами.

                ', + 'fa': '

                به قورباغه ها کمک کنید تا نیلوفرهای آبی خود را پیدا کنند. برای این کار از خاصیت های flex-direction و justify-content استفاده کنید.

                توجه داشته باشید وقتی که flex-direction مقادیر row-reverse یا column-reverse داشته باشد شروع و پایان معکوس می شود.

                ', + 'zh-cn': '

                帮助青蛙们回到它们的荷叶上。尽管它们看上去离的很近，需要用flex-direction和justify-content来帮它们到那里。

                注意当你调转行或列的方向后，flex-start和flex-end对应的方向也被调转了。

                ', + 'zh-tw': '

                幫助青蛙們回到它們的荷葉上。儘管它們看上去離得很近，需要用flex-direction和justify-content來幫它們到那裏。

                注意當你調轉列或行的方向後，flex-start和flex-end對應的方向也被調轉了。

                ', + 'tr': '

                Kurbağaların kendi nilüfer yapraklarını bulmalarına yardımcı olun. Yakında görünseler de, flex-direction ve justify-content kurallarını kullanarak onları yerlerine götürebilirsiniz.

                Yerleştirme yönünü değiştirdiğini row-reverse ya da column-reverse yaptığınız zaman, başlangıç ve bitiş referanslarının da değiştiğini unutmayın.

                ', + 'az': '

                Qurbağaların öz zanbaq yarpaqlarını tapmaqlarına kömək edin. Yaxında görünsələr də, flex-direction və justify-content qaydalarını istifadə edərək onları yerlərinı götürəbilərsiniz.

                Yerləşdirmə yönünü dəyişdirdiyiniz, yəni row-reverse və ya column-reverse etdiyiniz zaman, başlanğıc və bitiş referanslarının da dəyişdiyini unutmayın.

                ', + 'it': '

                Aiuta le rane a trovare la loro ninfea. Utilizza sia flex-direction sia justify-content per dirigerle nella giusta posizione.

                Nota che quando viene impostata la direzione inversa per le righe o per le colonne, vengono invertiti anche i punti di start e di end.

                ', + 'ko': '

                개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요. flex-direction과 justify-content를 모두 사용해야 합니다.

                column-reverse 또는 row-reverse를 사용하면 요소들의 start와 end의 순서도 뒤바뀝니다.

                ', + 'lt': '

                Padekite varlytėms persikelti ant savo lelijos lapų. Nors jie ir yra arti, tačiau prireiks abiejų, flex-direction ir justify-content komandų, kad tai pasiektumėte.

                Atkreipkite dėmesį, kad kai nustatote kryptį rikiuojančia atvirkščiai teksto skaitymo krypties arba iš apačios į viršų, elementų rikiavimo pradžia ir pabaiga taip pat apkeičiama pusėmis.

                ', + 'vi': '

                Giúp đỡ những chú ếch tìm thấy các lá bông súng của chúng. Mặc dù các lá gần nhau, nhưng sẽ cần cả hai thuộc tính flex-direction và justify-content để đưa chúng đến nơi.

                Chú ý rằng khi bạn thiết lập các chiều hướng của một hàng hoặc cột đảo ngược, điểm bắt đầu và kết thúc cũng được đảo ngược.

                ', + 'pl': '

                Pomóż żabkom dotrzeć do swoich listków. Może i wydaje się, że są blisko ale potrzebne ci będą zarówno flex-direction jak i justify-content, aby wykonać to zadanie.

                Zauważ, że ustawiając wartość z dopiskiem reverse, początek i koniec także się odwracają.

                ', + 'cs': '

                Pomozte žabkám na své lekníny. Vypadá to snadně, ale budete potřebovat kombinaci flex-direction a justify-content.

                Všiměte si, že když se otočí řádek, prohodí se i začátek a konec.

                ', + 'ja': '

                カエルたちがそれぞれの蓮の葉に乗るのを助けてあげましょう。もうほとんど乗っているようにも見えますが、ちゃんと乗せるにはflex-directionとjustify-contentの両方を使う必要があります。

                方向としてrow-reverseやcolumnを指定した場合、始点と終点もまた逆になることに気を付けてください。

                ', + 'hu': '

                Segíts a békáknak megtalálni saját tündérrózsáikat. Bár úgy tűnik, egész közel járunk, mégis szükség lesz mind a flex-direction, mind pedig a justify-content tulajdonságra, hogy odajuttassuk őket.

                Vedd figyelembe, hogy ha az irányzékot ellentétesre (reversed) állítod, a \'start\' és az \'end\' értékek jelentése is megcserélődik.

                ', + 'eo': '

                Helpu la ranojn alveni al iliaj akvolilifolioj. Kvankam ili ŝajnas proksimaj, lokigi la ranojn tien postulos ambaŭ flex-direction kaj justify-content.

                Rimarku, kiam oni metas la direkton al inversita vico aŭ kolumno, tiam la komenco kaj la fino ankaŭ estus inversitaj.

                ', + 'sv': '

                Hjälp grodorna att ta sig till sina blomblad. Även om dom ser ut att vara nära så kommer det krävas både flex-direction och justify-content för att ta sig dit.

                Notera att när du ändra riktning till en motsat rad eller kolumn så är start och slut också åt motsat håll.

                ', + 'uk': '

                Допоможи жабенятам потрапити на своє листя. Хоча може здатися, що вони вже на своїх місцях, але лише використав разом flex-direction та justify-content ти зможеш їх вірно розмістити.

                Зверни увагу на те, що коли встановлюєш зворотній напрямок рядків або стовпчиків, початок і кінець також міняються місцями.

                ', + 'hi': '

                मेंढकों को उनके अपने लिली के पत्ते तक पहुंचाइये। हालांकि यह एक जैसे दिखते हैं, फिर भी इन्हें पहुँचाने के लिए हमें flex-direction एवं justify-content की मदद लेनी होगी।

                ध्यान रखिये यदि आप पंक्ति एवं स्तम्भ की दिशा बदलते हैं, तो उनके शुरुआत एवं अंत भी बदल जाते हैं

                ', + 'sr': '

                Помози жабицама да дођу до својих локвања. Иако се чини да су близу, требаће ти оба flex-direction и justify-content да их поставиш где треба.

                Обрати пажњу да када дефинишеш смер да буде обрнути ред или колона, почетак и крај су такође обрнути.

                ', + 'bs': '

                Pomozi žabicama da dođu do svojih listova. Iako se čini da su blizu, trebaće ti oba flex-direction i justify-contentda ih postaviš gdje treba.

                Obrati pažnju da kada definišeš smjer da bude obrnuti red ili kolona, početak i kraj su takođe obrnuti.

                ', + 'hr': '

                Pomozi žabicama da dođu do svojih listova. Iako se čini da su blizu, trebat će ti oba flex-direction i justify-contentda ih postaviš gdje treba.

                Obrati pažnju kada definiraš smjer da red ili kolona budu obrnuti, početak i kraj su također obrnuti.

                ', + 'nl': '

                Help de kikkers naar hun eigen lelieblaadjes. Ook al lijken ze dichtbij, toch zal het zowel flex-direction en justify-content vergen om hen daar te krijgen.

                Let erop dat als je de richting (direction) omwisseld naar een \'reversed-row\' of \'reversed-column\', de start en het einde ook omgewisseld zijn.

                ', + 'ta': '

                தவளைகள் தங்கள் சொந்த இலைகளை பெற உதவவும். அவை நெருங்கி இருப்பது போல் தெரிகிறது என்றாலும், flex-direction மற்றும் justify-content பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

                கவனி: நீங்கள் வரிசை(row) அல்லது நிரல்(column) தலைகீழான திசையில் அமைக்கும் போது, தொடக்க மற்றும் இறுதி மதிப்புகள் மேலும் தலைகீழாய் மாறுவதை கவனியுங்கள்.

                ', + 'te': '

                కప్పలు తమ సొంత లిల్లీప్యాడ్‌లను పొందడానికి సహాయపడండి. అవి దగ్గరగా ఉన్నట్లు అనిపించినప్పటికీ, వాటిని అక్కడికి చేరుకోవడానికి flex-direction మరియు justify-content రెండూ పడుతుంది.

                మీరు దిశను సెట్ చేసినప్పుడు గమనించండి రివర్స్డ్ అడ్డు వరుస లేదా కాలమ్, స్టార్ట్ మరియు ఎండ్ కూడా రివర్స్ చేయబడతాయి.

                ', + 'ml': '

                തവളകൾ സ്വന്തം lilypads ലേക്കുള്ള സഹായിക്കുക. അവർ തൊട്ടു അടുത്ത് ആണെങ്കിൽ പോലും flex-direction and justify-content ഉപയോഗിക്കേണ്ടി വരും അവരെ ലക്ഷ്യസ്ഥാനത്തു എത്തിക്കാൻ

                തിരിയുന്ന വരി അല്ലെങ്കിൽ നിരയിലേക്ക് നിങ്ങൾ ദിശ സജ്ജമാക്കിയാൽ, ആരംഭവും അവസാനവും തിരസ്കരിക്കുന്നു.

                ', + 'el': '

                Βοηθήστε τους βατράχους να φτάσουν στα νούφαρά τους. Αν και φαίνονται κοντά, θα χρειαστεί τόσο το flex-direction όσο και το justify-content για να τους πάτε εκεί.

                Σημειώστε ότι όταν ορίζετε την κατεύθυνση σε μια αντεστραμμένη σειρά ή στήλη, η αρχή και το τέλος επίσης αντιστρέφονται.

                ', + 'mk': '

                Помогнете им на жабите да стигнат до своите листови. Иако се чинат близу, ќе бидат потребни и flex-direction и justify-content да ги доведеме таму.

                Приметете дека кога ја поставувате насоката на ред или колона обратно, почетокот и крајот исто така треба да бидат обратни.

                ', + 'lv': '

                Palīdzi katram vardulēnam nokļūt uz savas ūdensrozes. Kaut arī izskatās, ka tie jau atrodas tuvu, šim uzdevumam vajadzēs lietot gan flex-direction, gan justify-content.

                Ievēro, ka rindai vai kolonnai norādot apgriezto virzienu, sākums un beigas arī tiek apgriezti otrādāk.

                ', + 'id': '

                Bantu katak mencapai lilypads mereka sendiri. Meskipun mereka tampak dekat, itu akan membutuhkan keduanyaflex-direction dan justify-content untuk mencapai ke sana.

                Perhatikan bahwa ketika kamu mengatur arah ke baris atau kolom terbalik, mulai dan akhir juga terbalik.

                ', + 'ar': '

                ساعد الضفادع بالوصول الى اوراق الزنبق الخاصة بها. على الرغم من انها تبدو قريبة, الا انك ستستخدم كل من flex-direction و justify-content لايصالهم لاماكنهم.

                لاحظ انه عند تعيين الاتجاه الى صف او عمود معكوس, يتم عكس البداية والنهاية ايضا.

                ', + 'ca': '

                Ajuda les granotes a arribar als seus nenúfars. Malgrat que semblen estar aprop, necesitaràs utilitzar flex-direction i justify-content per arribar fins allí.

                Nota que quan estableixes la direcció a una fila invertida o columna, l\'inici i el final també s\'inverteixen.

                ', + 'da': '

                Hjælp frøerne med at finde hen til deres egne åkander. Selvom de ser ud til næsten at være der, skal der bruges både flex-direction og justify-content for at få dem derhen.

                Bemærk at der byttes om på start og slut når du ændrer retningen til at være modsat tekstretningen.

                ', + 'et': '

                Aita konnadel saada oma vesiroosilehtedele. Kuigi nad võivad tunduda lähedal, on Sul vaja kasutada nii flex-direction kui ka justify-content, et nad sinna saada.

                Pea meeles, et kui sa annad suunaks reversed row või column, siis algus ja lõpp on samuti vastupidised.

                ', + 'fi': '

                Auta sammakot omille lumpeenlehdilleen. Vaikka ne ovatkin melkein paikoillaan, sinun tarvitsee määrittää sekä flex-direction että justify-content.

                Huomaa, että kun määrität vaaka- tai pystysuuntaisen järjestyksen käänteiseksi, alku- ja loppupää vaihtavat myös paikkaa.

                ', + 'gl': '

                Axuda ás rás a chegar a cadanseu nenúfar. Semellan preto, pero vas ter que usar tanto flex-direction coma justify-content para levalas ata alí.

                Pensa que cando invertes a dirección da fila ou da columna, o comezo e o final tamén se intercambian.

                ', + 'th': '

                ช่วยเจ้ากบทั้งหลายไปหาใบบัวของมัน ถึงมันจะดูใกล้เคียง, มันก็ต้องใช้ทั้ง flex-direction และ justify-content ในการไปที่นั่น

                สังเกตว่าเมื่อคุณกำหนดทิศทางไปในทางกลับด้าน, จุดเริ่มต้นและจุดสิ้นสุดก็กลับด้านไปด้วย

                ', + 'mn': '

                Мэлхийнүүдийг өөрсөдтэй нь ижил өнгийн сараана цэцэгст хүрэхэд нь туслаарай. Тэгэхийн тулд flex-direction болон justify-content хоёуланг нь ашиглах шаардагатай болно.

                Урвуу байрлалтай мөр эсвэл баганын чиглэлийг тохируулах үед эхлэл ба төгсгөл нь мөн урвуу болно гэдгийг анхаарна уу.

                ' + }, + board: 'gyr', + style: { 'flex-direction': 'row-reverse', 'justify-content': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 4', + instructions: { + 'en': '

                Help the frogs find their lilypads using flex-direction and justify-content.

                Notice that when the flex direction is a column, justify-content changes to the vertical and align-items to the horizontal.

                ', + 'he': '

                עזרו לצפרדעים להגיע לעלים שלהן בשימוש ב-flex-direction וב-justify-content.

                שימו לב שכאשר כיוון ה-flex הוא עמודה, justify-content משנה את הציר האנכי (כי הוא הופך להיות הציר הראשי) ו-align-items משנה את הציר האופקי (שהופך להיות הציר המשני).

                ', + 'ro': '

                Ajută broaștele să-și găsească nuferii folosind flex-direction și justify-content.

                Observă că atunci când direcția flex este o coloană, justify-content schimbă pe verticală și align-items pe orizontală.

                ', + 'bg': '

                Помогни на жабчетата да намерят своите листа, използвайки flex-direction и justify-content.

                Забележи, че когато flex direction е колона, justify-content променя по вертикалата и align-items променя по хоризонталата.

                ', + 'de': '

                Hilf den Fröschen mit flex-direction und justify-content, ihr Seerosenblatt zu finden.

                Hinweis: Wenn du eine vertikale Ausrichtung wählst, beeinflusst justify-content die vertikale Ausrichtung und align-items die horizontale.

                ', + 'pt-br': '

                Ajude os sapos a encontrar suas vitórias-régias usando flex-direction e justify-content.

                Note que quando a direção é em coluna, justify-content muda para a vertical e align-items para a horizontal.

                ', + 'es': '

                Ayuda a las ranas a encontrar sus hojas de lirio usando flex-direction y justify-content.

                Nota que cuando es una columna, justify-content cambia a vertical y align-items a horizontal.

                ', + 'fr': '

                Aidez les grenouilles à trouver leurs nénuphars en utilisant flex-direction et justify-content.

                Remarquez que quand la direction est en colonne, justify-content change pour la verticale et align-items pour l\'horizontale.

                ', + 'ru': '

                Помоги лягушатам найти их лилии с помощью flex-direction и justify-content.

                Заметь, когда в качестве направления выбрана колонка, то justify-content влияет на вертикальное выравнивание, а align-items — на горизонтальное.

                ', + 'fa': '

                به قورباغه ها کمک کنید تا به نیلوفرهای آبی خود برسند برای این کار از خاصیت های flex-direction و justify-content استفاده کنید.

                توجه داشته باشید وقتی flex-direction مقدار column داشته باشد, محور justify-content عمودی و align-items افقی می شود.

                ', + 'zh-cn': '

                用flex-direction和justify-content来帮助青蛙找到他们的方向

                注意当flex以列为方向时，justify-content控制纵向对齐，align-items控制横向对齐。

                ', + 'zh-tw': '

                用flex-direction和justify-content來幫助青蛙找到他們的方向

                注意當flex以行爲方向時，justify-content控制縱向對齊，align-items控制橫向對齊。

                ', + 'tr': '

                flex-direction ve justify-content kurallarını kullanarak kurbağaların kendi nilüfer yapraklarını bulmalarına yardımcı olun.

                flex direction kuralı column değerini aldığında, justify-content kuralı dikeyde ve align-items kuralı yatayda çalışır, unutmayın.

                ', + 'az': '

                flex-direction və justify-content qaydalarını istifadə edərək qurbağaların öz zanbaq yarpaqlarını tapmaqlarına kömək edin.

                flex direction qaydası column dəyərini aldığı zaman, justify-content qaydası şaquli istiqamət də və align-items qaydası isə horizontal istiqamətdə işləyir.

                ', + 'it': '

                Aiuta le rane a raggiungere le ninfee utilizzando flex-direction e justify-content.

                Nota che quando la direzione flex è una colonna, justify-content cambia l\'allineamento verticale e align-items quello orizzontale.

                ', + 'ko': '

                개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요. flex-direction과 justify-content를 모두 사용해야 합니다.

                Flex의 방향이 column일 경우 justify-content의 방향이 세로로, align-items의 뱡향이 가로로 바뀝니다.

                ', + 'lt': '

                Naudodami flex-direction ir justify-content padėkite varlytėms rasti savo lelijos lapus.

                Atkreipkite dėmesį, kad kai rikiavimo būdas yra stulpelis justify-content keičia elementų rikiavimą vertikaliai, o align-items horizontaliai.

                ', + 'vi': '

                Giúp đỡ những chú ếch tìm thấy các lá bông súng của chúng bằng cách sử dụng flex-direction và justify-content.

                Chú ý rằng khi hướng flex là hàng dọc, justify-content thay đổi thành chiều dọc và align-items to chiều ngang.

                ', + 'pl': '

                Pomóż żabkom dotrzeć do listków używając flex-direction i justify-content.

                Zauważ, że w przypadku gdy flex direction ma wartość column to justify-content wyrównuje element pionowo, a align-items poziomo.

                ', + 'cs': '

                Pomozte žabkám najít své lekníny pomocí flex-direction a justify-content.

                Všiměte si, že když je hlavní osa svislá, justify-content zarovnává prvky svisle a align-items vodorovně.

                ', + 'ja': '

                flex-directionとjustify-contentを使って、カエルたちがそれぞれの蓮の葉を見つけるのを助けてあげてください。

                flexの方向がcolumnのとき、justify-contentは垂直方向の、align-itemsは水平方向の並び方を変えるようになることに気を付けてください。

                ', + 'hu': '

                Segíts a békáknak megtalálni a tündérrózsáikat a flex-direction és a justify-content használatával.

                Vedd figyelembe, hogy ha a flex direction értéke column (oszlopos), akkor a justify-content már a függőleges, míg az align-items a vízszintes elrendezésre vonatkozik.

                ', + 'eo': '

                Lokigu la ranojn al iliaj akvolilifolioj pere de flex-direction kaj justify-content.

                Rimarku, kiam la flex-a direkto estas kolumno, tiam justify-content ŝanĝus al la vertikalo kaj align-items al la horizontalo.

                ', + 'sv': '

                Hjälp grodorna att ta sig till sina blomblad genom att använda flex-direction och justify-content.

                Notera att när flex-direction är en kolumn så ändras justify-content till vertikalt och align-items till horisontellt.

                ', + 'uk': '

                Допоможи жабенятам потрапити на своє листя латаття за допомогою flex-direction та justify-content.

                Зауваж, коли напрямок обрано стовпчиком, то justify-content впливає на вертикальне вирівнювання, а align-items - на горизонтальне.

                ', + 'hi': '

                flex-direction एवं justify-content से मेंढकों को उनके लिली के पत्ते ढुंढने में मदद कीजिये।

                ध्यान दीजिये, जब भी flex direction स्तम्भ की जाती है, justify-content ऊर्ध्वाधर में एवं align-items छैतिज़ में बदल जाता है।

                ', + 'sr': '

                Помози жабицама да дођу до својих локвања користећи flex-direction и justify-content.

                Обрати пажњу да када је флекс правац колона justify-content постаје вертикалан а align-items постаје хоризонталан.

                ', + 'bs': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction i justify-content.

                Obrati pažnju da kada je fleks pravac kolona justify-content postaje vertikalan a align-items postaje horizontalan.

                ', + 'hr': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction i justify-content.

                Obrati pažnju da kada je fleks pravac kolona justify-content postaje vertikalan a align-items postaje horizontalan.

                ', + 'nl': '

                Help de kikkers hun lelieblaadjes vinden door gebruik te maken van flex-direction en justify-content.

                Let erop dat waneer de flex-direction column (verticaal) is, justify-content van toepassing is op de verticale as, en align-items op de horizontale as.

                ', + 'ta': '

                flex-direction மற்றும் justify-content பயன்படுத்தி தவளைகள் தங்கள் சொந்த இலைகளை சென்றடைய உதவவும்.

                கவனி: flex direction மதிப்பு column என்றிருக்கும்போது, justify-content செங்குத்து(vertical) மாற்றங்களையும் மற்றும் align-items கிடைமட்ட(horizontal) மாற்றங்களையும் அடைகிறது.

                ', + 'te': '

                కప్పలు వారి లిల్లీప్యాడ్‌లను flex-direction మరియు justify-content ఉపయోగించి కనుగొనడంలో సహాయపడండి. ఒక నిలువు వరుస, justify-content నిలువుకు మార్పులు మరియు align-items క్షితిజ సమాంతరంగా.

                ', + 'ml': '

                flex-direction and justify-content ഉപയോഗിച്ച് വഴു കണ്ടു പിടിക്കാൻ സഹായിക്കുക .

                ശ്രദ്ധിക്കുക, flex direction column ആണെങ്കിൽ justify-content vertical ആകും align-items horizontal ആകും .

                ', + 'el': '

                Βοηθήστε τους βατράχους να βρουν τα νούφαρά τους χρησιμοποιώντας τα flex-direction και justify-content.

                Σημειώστε ότι όταν η κατεύθυνση flex είναι μια στήλη, το justify-content αλλάζει στον κάθετο άξονα και το align-items στον οριζόντιο.

                ', + 'mk': '

                Помогнете им на жабите да ги најдат своите листови со користење на flex-direction и justify-content.

                Приметете дека кога flex насоката е колона, justify-content променува по вертикалата и align-items по хоризонталата.

                ', + 'lv': '

                Lietojot flex-direction un justify-content, palīdzi katram vardulēnam nokļūt uz savas ūdensrozes. Ievēro, ka "flex-direction" esot "column", justify-content mainās uz vertikālo un align-items uz horizontālo.

                ', + 'id': '

                Bantu katak menemukan lilypads mereka menggunakan flex-direction dan justify-content.

                Perhatikan bahwa ketika arah flex adalah kolom, justify-content ubah vertical dan align-items dan ke horizontal.

                ', + 'ar': '

                ساعد الضفادع بالوصول الى اوراق الزنبق الخاصة بها باستخدام flex-direction و justify-content.

                لاحظ انه عند استخدام الاتجاه العامودي, justify-content تتغير الى عامودي و align-items تتغير الى افقي.

                ', + 'ca': '

                Ajuda les granotes a trobar els seus nenúfars utilitzant flex-direction i justify-content.

                Nota que quan és una columna, justify-content canvia a vertical i align-items a horitzontal.

                ', + 'da': '

                Hjælp frøerne med at finde deres åkander med flex-direction og justify-content.

                Bemærk at justify-content ændres til lodret og align-items til vandret når flex-retningen er en kolonne.

                ', + 'et': '

                Aita konnadel leida oma vesiroosileht kasutades flex-direction ja justify-content.

                Pea meeles, et kui flex direction on veerg (column), siis justify-content muutub vertikaalseks ja align-items horisontaalseks

                ', + 'fi': '

                Auta sammakoita löytämään omat lumpeenlehtensä ominaisuuksien flex-direction ja justify-content avulla.

                Huomaa, että kun elementit järjestetään pystysuunnassa, kohdistaa justify-content elementit pystysuuntaisesti ja align-items vaakasuuntaisesti.

                ', + 'gl': '

                Axuda ás rás a chegar aos nenúfares botando man de flex-direction e justify-content.

                Ten en conta que cando a dirección é de columna, justify-content pasa a controlar o eixe vertical e align-items o horizontal.

                ', + 'th': '

                ช่วยเจ้ากบทั้งหลายไปหาใบบัวของมัน ด้วยคำสั่ง flex-direction และ justify-content.

                สังเกตว่าถ้า flex direction เป็น column, justify-content จะเปลี่ยนไปเป็นแนวตั้งและ align-items จะเปลี่ยนไปเป็นแนวนอน

                ', + 'mn': '

                Мэлхийнүүдэд flex-direction болон justify-content-г ашиглан сараана цэцэгсээ олоход нь туслаарай.

                flex-direction проперти column байх үед justify-content босоо чиглэлд, align-items хэвтээ чиглэлд өөрчлөгдөнө гэдгийг анхаарна уу.

                ' + }, + board: 'gyr', + style: { 'flex-direction': 'column', 'justify-content': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 5', + instructions: { + 'en': '

                Help the frogs find their lilypads using flex-direction and justify-content.

                ', + 'he': '

                עזרו לצפרדעים להגיע לעלים שלהן בשימוש ב-flex-direction וב-justify-content.

                ', + 'ro': '

                Ajută broaștele să-și găsească nuferii folosind flex-direction și justify-content.

                ', + 'bg': '

                Помогни на жабчетата да намерят своите листа, използвайки flex-direction и justify-content.

                ', + 'de': '

                Hilf den Fröschen mit flex-direction und justify-content, ihr Seerosenblatt zu finden.

                ', + 'pt-br': '

                Ajude os sapos a encontrar suas vitórias-régias usando flex-direction e justify-content.

                ', + 'es': '

                Ayuda a las ranas a encontrar sus hojas de lirio usando flex-direction y justify-content.

                ', + 'fr': '

                Aidez les grenouilles à trouver leurs nénuphars en utilisant flex-direction et justify-content.

                ', + 'ru': '

                Помоги лягушатам найти их лилии с помощью flex-direction и justify-content.

                ', + 'fa': '

                به قورباغه ها کمک کنید تا نیلوفرهای آبی خود را پیدا کنند. با استفاده از flex-direction و justify-content این کار را انجام دهید.

                ', + 'zh-cn': '

                用flex-direction和justify-content来帮助青蛙回到他们的荷叶上。

                ', + 'zh-tw': '

                用flex-direction和justify-content來幫助青蛙回到他們的荷葉上。

                ', + 'tr': '

                flex-direction ve justify-content kurallarını kullanarak kurbağaların kendi nilüfer yapraklarını bulmalarına yardımcı olun.

                ', + 'az': '

                flex-direction və justify-content qaydalarını istifadə edərək qurbağaların öz zanbaq yarpaqlarını tapmaqlarına kömək edin.

                ', + 'it': '

                Aiuta le rane a raggiungere la loro ninfea utilizzando flex-direction e justify-content.

                ', + 'ko': '

                flex-direction과 justify-content를 사용하여 개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요.

                ', + 'lt': '

                Padėkite varlytėms rasti savo lelijos lapus naudodami flex-direction ir justify-content.

                ', + 'vi': '

                Giúp đỡ những chú ếch tìm các lá bông súng của họ bằng cách sử dụng flex-direction và justify-content.

                ', + 'pl': '

                Pomóż żabkom dotrzeć do swoich listków używając flex-direction i justify-content.

                ', + 'cs': '

                Pomozte žabkám najít své lekníny pomocí flex-direction a justify-content.

                ', + 'ja': '

                flex-directionとjustify-contentを使って、カエルたちがそれぞれの蓮の葉を見つけるのを助けてあげてください。

                ', + 'hu': '

                Segíts a békáknak megtalálni a tündérrózsáikat a flex-direction és a justify-content használatával.

                ', + 'eo': '

                Alvenigu la ranojn al iliaj nimfeofolioj uzante flex-direction kaj justify-content.

                ', + 'sv': '

                Hjälp grodorna till sina blomblad genom att använda flex-direction och justify-content.

                ', + 'uk': '

                Допоможи жабенятам знайти своє листя латаття скориставшись flex-direction та justify-content.

                ', + 'hi': '

                flex-direction एवं justify-content की मदद से मेंढकों को उनके लिली के पत्ते तक पहुंचाइये।

                ', + 'sr': '

                Помози жабицама да дођу до својих локвања користећи flex-direction и justify-content.

                ', + 'bs': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction i justify-content.

                ', + 'hr': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction i justify-content.

                ', + 'nl': '

                Help de kikkers met het vinden van hun lelieblaadjes door gebruik te maken van flex-direction en justify-content.

                ', + 'ta': '

                flex-direction மற்றும் justify-content பயன்படுத்தி தவளைகள் தங்கள் சொந்த இலைகளை சென்றடைய உதவவும்.

                ', + 'te': '

                కప్పలు తమ లిల్లీప్యాడ్‌లను flex-direction మరియు justify-content ఉపయోగించి కనుగొనడంలో సహాయపడండి.

                ', + 'ml': '

                flex-direction and justify-content ഉപയോഗിച്ച് വഴി കണ്ടെത്താൻ സഹായിക്കുക.

                ', + 'el': '

                Βοηθήστε τους βατράχους να βρουν τα νούφαρά τους χρησιμοποιώντας τα flex-direction και justify-content.

                ', + 'mk': '

                Помогнете им на жабите да ги најдат своите листови со користење на flex-direction и justify-content.

                ', + 'lv': '

                Palīdzi katram vardulēnam atrast savu ūdensrozi. Lieto flex-direction un justify-content

                ', + 'id': '

                Bantu katak menemukan lilypad menggunakan flex-direction dan justify-content.

                ', + 'ar': '

                ساعد الضفادع لإيجاد اوراق الزنبق باستخدام flex-direction و justify-content.

                ', + 'ca': '

                Ajuda les granotes a trobar els seus nenúfars utilitzant flex-direction i justify-content.

                ', + 'da': '

                Hjælp frøerne med at finde deres åkander med flex-direction og justify-content.

                ', + 'et': '

                Aita konnadel leida oma vesiroosileht kasutades flex-direction ja justify-content.

                ', + 'fi': '

                Auta sammakoita löytämään omat lumpeenlehtensä ominaisuuksien flex-direction ja justify-content avulla.

                ', + 'gl': '

                Leva as rás ata os nenúfares empregando flex-direction e justify-content.

                ', + 'th': '

                ช่วยเจ้ากบทั้งหลายไปสู่ใบบัวของมัน ด้วยคำสั่ง flex-direction และ justify-content.

                ', + 'mn': '

                Мэлхийнүүдэд flex-direction болон justify-content-г ашиглан сараана цэцгээ олоход нь туслаарай.

                ' + }, + board: 'gyr', + style: { 'flex-direction': 'column-reverse', 'justify-content': 'space-between' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-direction 6', + instructions: { + 'en': '

                Help the frogs find their lilypads using flex-direction, justify-content, and align-items.

                ', + 'he': '

                עזרו לצפרדעים להגיע לעלים שלהן בשימוש ב-flex-direction, justify-content, וב-align-items.

                ', + 'ro': '

                Ajută broaștele să-și găsească nuferii folosind flex-direction, justify-content, și align-items.

                ', + 'bg': '

                Помогни на жабчетата да намерят своите листа, използвайки flex-direction, justify-content и align-items.

                ', + 'de': '

                Hilf den Fröschen mit flex-direction, justify-content und align-items, ihr Seerosenblatt zu finden.

                ', + 'pt-br': '

                Ajude os sapos a encontrar suas vitórias-régias usando flex-direction, justify-content e align-items.

                ', + 'es': '

                Ayuda a las ranas a encontrar sus hojas de lirio usando flex-direction, justify-content, y align-items.

                ', + 'fr': '

                Aidez les grenouilles à trouver leurs nénuphars en utilisant flex-direction, justify-content, et align-items.

                ', + 'ru': '

                Помоги лягушатам найти их лилии с помощью flex-direction, justify-content и align-items.

                ', + 'fa': '

                به قورباغه ها کمک کنید تا نیلوفرهای آبی را بیابند. با استفاده از خاصیت های flex-direction, justify-content و align-items این کار را انجام دهید.

                ', + 'zh-cn': '

                用flex-direction，justify-content以及align-items来帮助青蛙回到他们的荷叶上。

                ', + 'zh-tw': '

                用flex-direction，justify-content以及align-items來幫助青蛙回到他們的荷葉上。

                ', + 'tr': '

                flex-direction, justify-content ve align-items kurallarını kullanarak kurbağaların kendi nilüfer yapraklarını bulmalarına yardımcı olun.

                ', + 'az': '

                flex-direction, justify-content və align-items qaydalarını istifadə edərək qurbağaların öz zanbaq yarpaqlarını tapmaqlarına kömək edin.

                ', + 'it': '

                Aiuta le rane a raggiungere la loro ninfea utilizzando flex-direction, justify-content e align-items.

                ', + 'ko': '

                flex-direction, justify-content, 그리고 align-items를 사용하여 개구리들이 자기 색깔과 같은 수련잎 위로 이동할 수 있도록 도와주세요.

                ', + 'lt': '

                Padėkite varlytėms rasti savo lelijos lapus naudodami flex-direction, justify-content, ir align-items.

                ', + 'vi': '

                Giúp đỡ những chú ếch tìm các lá bông súng của họ bằng cách sử dụng flex-direction, justify-content, và align-items.

                ', + 'pl': '

                Pomóż żabkom dotrzeć do swoich listków przy pomocy flex-direction, justify-content i align-items.

                ', + 'cs': '

                Pomozte žabkám na lekníny vlastnostmi flex-direction, justify-content a align-items.

                ', + 'ja': '

                flex-directionとjustify-content、align-itemsを使って、カエルたちがそれぞれの蓮の葉を見つけるのを助けてあげてください。

                ', + 'hu': '

                Segíts a békáknak megtalálni a tündérrózsáikat a flex-direction, a justify-content, és az align-items használatával.

                ', + 'eo': '

                Helpu la ranojn trovi iliajn akvolilifoliojn pere de flex-direction, justify-content, kaj align-items.

                ', + 'sv': '

                Hjälp grodorna till sina blomblad genom att använda flex-direction, justify-content och align-items.

                ', + 'uk': '

                Допоможи жабенятам знайти своє листя латаття скориставшись flex-direction, justify-content, та align-items.

                ', + 'hi': '

                flex-direction, justify-content एवं align-items की मदद से मेंढकों को उनके लिली के पत्ते तक पहुंचाइये।

                ', + 'sr': '

                Помози жабицама да дођу до својих локвања користећи flex-direction, justify-content и align-items.

                ', + 'bs': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction, justify-content i align-items.

                ', + 'hr': '

                Pomozi žabicama da dođu do svojih listova koristeći flex-direction, justify-content i align-items.

                ', + 'nl': '

                Help de kikkers met het vinden van hun lelieblaadjes door gebruik te maken van flex-direction, justify-content, en align-items.

                ', + 'ta': '

                flex-direction, justify-content மற்றும் align-items பயன்படுத்தி தவளைகள் தங்கள் சொந்த இலைகளை சென்றடைய உதவவும்.

                ', + 'te': '

                కప్పలు తమ లిల్లీప్యాడ్‌లను flex-direction, justify-content మరియు align-items ఉపయోగించి కనుగొనడంలో సహాయపడండి.

                ', + 'ml': '

                flex-direction, justify-content, and align-items ഉപയോഗിച്ച് വഴി കണ്ടെത്താൻ സഹായിക്കുക .

                ', + 'el': '

                Βοηθήστε τους βατράχους να βρουν τα νούφαρά τους χρησιμοποιώντας τα flex-direction, justify-content, και align-items.

                ', + 'mk': '

                Помогнете им на жабите да ги најдат своите листови со користење на flex-direction, justify-content, и align-items.

                ', + 'lv': '

                Lieto flex-direction, justify-content, align-items un palīdzi katram vardulēnam nokļūt līdz savai ūdensrozei.

                ', + 'id': '

                Bantu katak menemukan lilypad menggunakan flex-direction, justify-content, dan align-items.

                ', + 'ar': '

                ساعد الضفادع لإيجاد اوراق الزنبق باستخدام flex-direction, justify-content, و align-items.

                ', + 'ca': '

                Ajuda les granotes a trobar els seus nenúfars utilitzant flex-direction, justify-content, i align-items.

                ', + 'da': '

                Hjælp frøerne med at finde deres åkander med flex-direction, justify-content og align-items.

                ', + 'et': '

                Aita konnadel leida oma vesiroosileht kasutades flex-direction, justify-content, ja align-items.

                ', + 'fi': '

                Auta sammakoita löytämään omat lumpeenlehtensä ominaisuuksien flex-direction, justify-content ja align-items avulla.

                ', + 'gl': '

                Axuda ás rás a chegar a cadanseu nenúfar empregando flex-direction, justify-content, e align-items.

                ', + 'th': '

                ช่วยเจ้ากบทั้งหลายไปสู่ใบบัวของมัน ด้วยคำสั่ง flex-direction, justify-content, และ align-items.

                ', + 'mn': '

                Мэлхийнүүдэд flex-direction, justify-content, align-items-г ашиглан сараана цэцэгээ олоход нь туслаарай.

                ' + }, + board: 'gyr', + style: { 'flex-direction': 'row-reverse', 'justify-content': 'center', 'align-items': 'flex-end' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'order 1', + instructions: { + 'en': '

                Sometimes reversing the row or column order of a container is not enough. In these cases, we can apply the order property to individual items. By default, items have a value of 0, but we can use this property to also set it to a positive or negative integer value (-2, -1, 0, 1, 2).

                Use the order property to reorder the frogs according to their lilypads.

                ', + 'he': '

                לפעמים היפוך הסדר של השורה או העמודה אינו מספיק. במקרים כאלה, אפשר להשתמש בתכונת ה-order על פריטים ספציפיים. כברירת מחדל, יש לפריטים ב-flex ערך 0, אבל אפשר להשתמש בתכונה הזו כדי להגדיר להם מספר חיובי או שלילי (2, 1, 0, 1-, 2-).

                נשתמש ב-order כדי לסדר מחדש את הצפרדעים בהתאם לעלים שלהן.

                ', + 'ro': '

                Câteodată inversarea ordinii rândului sau coloanei nu este de ajuns. În aceste cazuri, putem aplica proprietatea order individual elementelor. În mod implicit, elementele au valoarea 0, dar putem folosi această proprietate să o setăm la o valoare intreagă pozitivă sau negativă.

                Folosește proprietatea order pentru a ordona broaștele în funcție de nuferii lor.

                ', + 'bg': '

                Понякога обръщането на реда на елементите в ред или колона не е достатъчно. В тези случаи можем да приложим свойството order към индивидуален елемент. По подразбиране, елементите имат стойност 0, но можем да използваме това свойство, за да я променим, използвайки положително или отрицателно цяло число.

                Използвай свойството order, за да пренаредиш жабчетата според техните листа.

                ', + 'de': '

                Manchmal reicht es nicht aus, die horizontale oder vertikale Ausrichtung eines Containers umzukehren. In so einem Fall können wir die order-Eigenschaft für einzelne Elemente verwenden. Standardmäßig haben alle Elemente den Wert 0, aber wir können die Eigenschaft verwenden, um ihn auf eine positive oder negative ganze Zahl zu setzen.

                Benutze die order-Eigenschaft, um die Frösche entsprechend ihrer Seerosenblätter anzuordnen.

                ', + 'pt-br': '

                Às vezes, reverter a ordem de uma coluna ou de um container não é suficiente. Nesses casos, podemos aplicar a propriedade order para itens individuais. Por padrão, itens tem um valor de 0, mas nós podemos usar essa propriedade para alterar para um valor inteiro positivo ou negativo.

                Use a propriedade order para reordenar os sapos de acordo com suas vitórias-régias.

                ', + 'es': '

                A veces, invertir el orden de una fila o columna de un contenedor no es suficiente. En esos casos, nosotros podemos aplicar la propiedad order a elementos individuales. Por defecto, los elementos tienen un valor 0, pero nosotros podemos usar esta propiedad para establecerlo a un número entero positivo o negativo.

                Usa la propiedad order para reordenar las ranas de acuerdo a sus hojas de lirio.

                ', + 'fr': '

                Parfois, inverser l\'ordre de la rangée ou la colonne ne suffit pas. Dans ces cas, on peut appliquer la propriété order à des éléments individuels. Par défaut, les éléments ont une valeur de 0, mais on peut utiliser cette propriété pour changer la valeur à un entier positif ou négatif.

                Utilisez la propriété order pour réorganiser les grenouilles par rapport à leurs nénuphars.

                ', + 'ru': '

                Иногда изменения порядка отображения элементов в контейнере недостаточно. В таких случаях мы можем применить свойство order для конкретных элементов. По умолчанию, значение этого свойства у элементов равно 0, но мы можем задать положительное или отрицательное целое число этому свойству.

                Используй свойство order, чтобы разместить лягушат на своих лилиях.

                ', + 'fa': '

                گاهی اوقات ما نیاز داریم فقط ایتم ها را جابه جا کنیم. برای این کار خاصیت order استفاده می کنیم. به صورت پیشفرض آیتم ها مقدار 0 دارند, اما با استفاده از این خاصیت شما می توانید مقدار مثبت و منفی برای آیتم ها تعیین کنید.

                با استفاده از خاصیت order می توانید ترتیب نشستن قورباغه ها روی نیلوفرهای آبی خود را تعیین کنید.

                ', + 'zh-cn': '

                有时候仅仅调转行或列的方向是不够的。在这些情况，我们可以设置单个元素的order属性。元素的属性默认值为0，但是我们设置这个属性为正数或负数。

                用order来调整青蛙的顺序。

                ', + 'zh-tw': '

                有時候僅僅調轉列或行的方向是不夠的。在這些情況，我們可以設置單個元素的order屬性。元素的屬性默認值爲0，但是我們設置這個屬性爲正數或負數。

                用order來調整青蛙的順序。

                ', + 'tr': '

                Bazen row ya da column yerleşimini tersine çevirmek yeterli olmaz. Bu gibi durumlarda order kuralı ile öğeleri tek tek sıralandırabiliriz. Öğelerin başlangıç sıra değeri 0\'dır, ama biz bu değeri pozitif ya da negatif bir değere eşitleyebiliriz.

                order kuralını kullanarak kurbağaları nilüfer yapraklarına göre sıralayın.

                ', + 'az': '

                Bəzən row və ya column yerləşməsini tərsinə çevirmək yetərli deyil. Belə hallarda order qaydası ilə elementləri tək tək sıralaya bilərsiniz. Elementlərin başlanğıc sıra dəyəri 0\'dır, amma biz bu dəyəri pozitiv və ya neqativ bir dəyərə bərabərləşdirə bilərik.

                order qaydasını istifadə edərək qurbağaları zanbaq yarpaqlarına görə düzün.

                ', + 'it': '

                A volte invertire l\'ordine di visualizzazione delle righe o delle colonne non è sufficiente. In questi casi possiamo applicare la proprietà order sui singoli elementi. Ogni elemento ha assegnato il valore 0 di default, ma è possibile utilizzare questa proprietà per assegnare un valore intero positivo o negativo.

                Utilizza order per muovere le rane sulla loro ninfea.

                ', + 'ko': '

                때때로 컨테이너의 row나 column의 순서를 역으로 바꾸는 것만으로는 충분하지 않습니다. 이러한 경우에는 order 속성을 각 요소에 적용할 수 있습니다. order의 기본 값은 0이며, 양수나 음수로 바꿀 수 있습니다.

                order 속성을 이용하여 개구리들의 순서를 수련잎의 순서에 맞게 바꿔주세요.

                ', + 'lt': '

                Kartais sukeisti supančio elemento eilutes su stulpeliais vietomis negana. Tokiais atvejais galima pritaikyti komandą order pavieniams elementams. Pagal nutylėjimą elementų eilės tvarką nusakanti vertė yra 0, bet galima naudoti šią komandą, kad vertę prilygintume teigiamam arba neigiamam skaičiui.

                Panaudokite komandą order, kad apkeistumėte varlytes vietomis, pagal jų lelijų lapus.

                ', + 'vi': '

                Đôi khi đảo chiều của hộp chứa theo hàng ngang hay hàng dọc là không đủ. Trong những trường hợp này, chúng ta có thể áp dụng thuộc tính order cho từng hạng mục riêng lẻ. Theo mặc định, các hạng mục có giá trị là 0, nhưng chúng ta có thể thay đổi thuộc tính đó với một giá trị số nguyên dương hoặc âm khác.

                Sử dụng thuộc tính order để sắp xếp lại những chú ếch theo các lá bông súng của chúng.

                ', + 'pl': '

                Czasami odwracanie wierszy i kolumn kontenera nie wystarcza. W takich przypadkach, możemy zastosować własność order do pojedynczego elementu. Domyślnie elementy mają wartość 0, ale przy pomocy tej własności możemy ustalić kolejność na dowolną dodatnią lub ujemną wartość.

                Przy pomocy własności order zmień kolejność żabek tak, aby każda była na swoim listku.

                ', + 'cs': '

                Samotná změna směru někdy nestačí. V těchto případech lze zvolit pořadí pomocí vlastnosti order jednotlivých prvků. Výchozí hodnota je 0, ale můžete použít libovolné kladné či záporné celé číslo.

                Použijte vlastnost order tak, aby se žabky ocitly na správných leknínech.

                ', + 'ja': '

                コンテナーの行や列の順序を逆にするだけでは足りないこともままあります。そういった場合、個別のアイテムにorderプロパティーを適用することができます。アイテムはデフォルトでは0の値を取りますが、正や負の整数値を設定することもできます。

                orderプロパティーを使って、蓮の葉に合うようカエルたちを並び替えてください。

                ', + 'hu': '

                Időnként a sorok vagy az oszlopok irányának megfordítása nem elégséges. Ilyen esetekben alkalmazhatjuk az order tulajdonságot az egyes elemekre. Alapértelmezettként az elemek a 0 értéket kapják, de lehetőségünk van negatív vagy pozitív egész számot megadni értékként.

                Használd az order tulajdonságot, hogy átrendezd a békákat a tündérrózsáiknak megfelelően.

                ', + 'eo': '

                Kelkfoje, inversante la vican aŭ kolumnan ordonon de ujo ne sufiĉas. Tiaokaze, ni povas apliki la order trajton al individuaj elementoj. Defaŭlte, elemento havas nulan valoron, sed oni povas uzi ĉi tiun trajton por ĝin igi pozitiva aŭ negativa entjera valoro.

                Uzu la order trajton por reordigi la ranojn laŭ iliaj nimfeofolioj.

                ', + 'sv': '

                Ibland räcker det inte med att ändra ordningen på en rad eller kolumn. I så fall kan man lägga till order på ett individuellt objekt. Från början har alla objekt värdet 0, men vi kan använda detta attribut till att sätta ett positivt eller negativt heltalsvärde.

                Använd order till att ändra ordningen på grodorna så att de hamnar på rätt blomblad.

                ', + 'uk': '

                Іноді зміни напрямку показу елементів контейнеру не достатньо. У таких випадках ми можемо застосувати властивість order до потрібних елементів. Типове значення властивості в елементів дорівнює 0, але ми можемо змінити значення на додатне або відʼємне ціле число.

                Використай властивість order для розташування жабенят на своїх листах латаття.

                ', + 'hi': '

                कभी-कभी पंक्ति एवं स्तम्भ का क्रम बदलना भी काफी नहीं नहीं होता। इस स्थिति में हम order प्रॉपर्टी का इस्तेमाल कर सकते हैं। मूलतः वस्तुओं का मान शून्य होता है। लेकिन इस प्रॉपर्टी के लिए सकारात्मक अथवा नकारात्मक पूर्णांक मान के लिए निर्धारित कर सकते हैं।

                order प्रॉपर्टी का इस्तेमाल कर मेंढकों को पुनः व्यवस्थित करें।

                ', + 'sr': '

                Некад није довољно само променити смер реда или колоне у контејнеру. У таквим случајевима можемо применити order својство на појединачним елементима. Иницијално, елементи имају вредност 0, али ми можемо искористити ово својство и дефинисати га као позитивну или негативну нумеричку вредност.

                Употреби order својство да измениш редослед жабица у складу са локвањима.

                ', + 'bs': '

                Nekad nije dovoljno samo promjeniti smjer reda ili kolone u kontejneru. U takvim slučajevima možemo primjeniti order svojstvo na pojedinačnim elementima. Inicijalno, elementi imaju vrijednost 0, ali mi možemo iskoristiti ovo svojstvo i definisati ga kao pozitivnu ili negativnu numeričku vrijednost.

                Upotrijebi order svojstvo da izmjeniš redosljed žabica u skladu sa listovima.

                ', + 'hr': '

                Nekad nije dovoljno samo promijeniti smjer reda ili kolone u kontejneru. U takvim slučajevima možemo primijeniti order svojstvo na pojedinačnim elementima. Inicijalno, elementi imaju vrijednost 0, ali mi možemo iskoristiti ovo svojstvo i definirati ga kao pozitivnu ili negativnu numeričku vrijednost.

                Upotrijebi order svojstvo da izmjeniš redosljed žabica u skladu sa listovima.

                ', + 'nl': '

                Soms is het omkeren van de rij/kolom volgorde van een container niet genoeg. In zulke gevallen kunnen we gebruik maken van de order eigenschap op individuele elementen. De standaardwaarde voor elementen is 0, maar we kunnen dit op een positief of negatief geheel getal instellen.

                Maak gebruik van de order eigenschap om de kikkers volgens de volgorde van de lelieblaadjes te ordenen.

                ', + 'ta': '

                சில நேரங்களில் வரிசை(row) அல்லது நிரல்(column) இவற்றை மாற்றுவது மட்டும் போதாது. இத்தகைய சமயங்களில் தனிப்பட்ட உருப்படிகளுக்கு(items) நாம் order property உபோயோகிக்கலாம். இயல்பாக, உருப்படிகள் 0 என்ற மதிப்பு பெற்றிருக்கும், நாம் இந்த order property பயன்படுத்தி ஒரு நேர்மறை(positive) அல்லது எதிர்மறையான)negative) முழு மதிப்பு கொடுக்கலாம்.

                order property பயன்படுத்தி தவளைகள் தங்கள் இலைகளை அதே வரிசையில் பெற உதவவும்

                ', + 'te': '

                కొన్నిసార్లు కంటైనర్ యొక్క అడ్డు వరుస లేదా కాలమ్ క్రమాన్ని తిప్పికొట్టడం సరిపోదు. ఈ సందర్భాలలో, మనం order ఆస్తిని వ్యక్తిగత వస్తువులకు వర్తింపజేయవచ్చు. అప్రమేయంగా, అంశాలు 0 విలువను కలిగి ఉంటాయి, కాని మనం ఈ ఆస్తిని సానుకూల (positive) లేదా ప్రతికూల(negative) పూర్ణాంక విలువకు (-2, -1, 0, 1, 2) సెట్ చేయడానికి ఉపయోగించవచ్చు.

                ఉపయోగించండి order కప్పలను వాటి లిల్లీప్యాడ్ల ప్రకారం క్రమాన్ని మార్చడానికి ఆస్తి.

                ', + 'ml': '

                ചിലപ്പോൾ ഒരു കണ്ടെയ്നറിന്റെ വരി അല്ലെങ്കിൽ നിര ക്രമം മറികടക്കാൻ പര്യാപ്തമല്ല. ഇങ്ങനെ ഉള്ള സാഹചര്യങ്ങളിൽ order വ്യക്തിഗത ഇനങ്ങളെ മാറ്റുവാൻ സാധിക്കും . സ്വതവേ, ഇനങ്ങൾക്കു് 0 എന്ന മൂല്ല്യം ഉണ്ടെങ്കിലും, ഈ വസ്തുവിനെ പോസിറ്റീവ് അല്ലെങ്കിൽ നെഗറ്റീവ് ഇന്റഗ്രർ മൂല്യമായി സജ്ജമാക്കാൻ നമുക്ക് ഉപയോഗിക്കാം.

                order ഉപയോഗിച്ച് തവളകളെ താമര ഇലകളിലേക്കു എത്തിക്കുക .

                ', + 'el': '

                Μερικές φορές η αντιστροφή της σειράς ταξινόμησης των σειρών ή των στηλών ενός container δεν είναι αρκετή. Σ\' αυτές τις περιπτώσεις, μπορούμε να εφαρμόσουμε την ιδιότητα order σε μεμονωμένα αντικείμενα. Από προεπιλογή, τα αντικείμενα έχουν αξία 0, αλλά μπορούμε να χρησιμοποιήσουμε αυτή την ιδιότητα για να την ορίσουμε σε μία θετική ή αρνητική ακέραιη αξία.

                Χρησιμοποιήστε την ιδιότητα order για να αναδιατάξετε τους βατράχους σύμφωνα με τα νούφαρά τους.

                ', + 'mk': '

                Понекогаш превртување на редоследот на редиците или колоните во контејнер не е доволно. Во овие случаи, можеме да го примениме order својството на индивидуални елементи. Стандардно, елементите имаат вредност од 0, но можеме да го искористиме ова својство да ја поставиме на позитивна или негативна вредност.

                Користете го order својството да ги прередите жабите според нивните листови.

                ', + 'lv': '

                Reizēm ar rindu vai kolonnu apgriezšanu nepietiek. Šajos gadījumos attiecīgajam elementam vari pievienot order metodi. Sākotnēji visiem elementiem šī vērtība ir 0, un šai metodei var piešķirt gan pozitīvas, gan negatīvas veselu skaitļu vērtības.

                Pielieto order metodi, lai katru vardulēnu novietotu uz atbilstošās ūdensrozes.

                ', + 'id': '

                Kadang-kadang membalik urutan baris atau kolom wadah tidak cukup. Dalam kasus ini, kita dapat menerapkan properti order ke masing-masing objek. Secara default, item memiliki nilai 0, tetapi kita dapat menggunakan properti ini untuk juga mengaturnya ke nilai integer positif atau negatif (-2, -1, 0, 1, 2).

                Gunakan order properti untuk mengatur ulang katak berdasarkan lilypads mereka.

                ', + 'ar': '

                بعض الاحيان يكون عكس اتجاه الصف او العامود للحاوية غير كافيا. في هذه الحالات, يمكننا استخدام خاصية order على عناصر بمفردها. افتراضيًا, العناصر تحمل القيمة 0,لكن يمكننا استخدام هذه الخاصية لتغييرها لقيمة رقم موجب او سالب (-2, -1, 0, 1, 2).

                استخدم خاصية order لاعادة ترتيب الضفادع بناءًا على اوراق الزنبق.

                ', + 'ca': '

                De vegades, invertir l\'ordre d\'una fila o columna d\'un contenidor no és suficient. En aquests casos, podem aplicar la propietat order a elements individuals. Per defecte, els elements tenen un valor 0, però nosaltres podem utilitzar aquesta propietat per estableir un nombre enter positiu o negatiu.

                Utilitza la propietat order per reordenar les granotes d\'acord als seus nenúfars.

                ', + 'da': '

                Nogle gange er det ikke nok at vende rundt på rækkefølgen i en beholder. I disse tilfælde kan vi bruge egenskaben order på de individuelle elementer. Som standard har elementer værdien 0, men vi kan bruge denne egenskab til at ændre værdien til et positivt eller negativt heltal (-2, -1, 0, 1, 2).

                Brug egenskaben order til at bytte rundt på frøerne så de har samme rækkefølge som deres åkander.

                ', + 'et': '

                Mõnikord ei aita vaid rea või veeru järjekorra ümber pööramisest. Sellistel juhtudel, saame me rakendada omaduse order üksikutele elementidele. Vaikimisi on elementidel väärtuseks 0, aga kasutades seda omadust saame me muuta väärtust nii positiivseks kui negatiivseks numbriteks. (-2, -1, 0, 1, 2).

                Kasuta omadust order, et muuta konnade järjekorda vastavalt sellele, millisele vesiroosilehele nad peavad minema.

                ', + 'fi': '

                Joskus säilön vaakasuuntaisen tai pystysuuntaisen järjestyksen kääntäminen ei riitä. Silloin voimme määrittää yksittäisille elementeille ominaisuuden order. Oletusarvon mukaan ominaisuuden arvo on 0, mutta sille voi määrittää positiivisen tai negatiivisen kokonaislukuarvon (-2, -1, 0, 1, 2).

                Aseta sammakot oikeaan järjestykseen lumpeenlehtien mukaisesti order-ominaisuuden avulla.

                ', + 'gl': '

                Ás veces non abonda con inverter a orde das filas ou columnas do contedor. Nestes casos, podemos aplicar a propiedade order para elementos individuais. Por defecto, os elementos teñen un valor de 0, pero podemos usar esta propiedade para cambiar ese valor a un número positivo ou negativo (-2, -1, 0, 1, 2).

                Usa a propiedade order para reordear as rás conforme aos seus nenúfares.

                ', + 'th': '

                ในบางครั้งการย้อนลำดับของ row หรือ column ของ container ก็ไม่เพียงพอ ในกรณีเหล่านี้ เราสามารถกำหนดค่าคุณสมบัติ order ให้แก่ items แต่ละตัวได้ โดยปกติค่าของ items จะมีค่าเป็น 0, แต่เราสามารถใช้คุณสมบัตินี้ในการกำหนดค่าให้เป็นเลขบวกหรือเลขลบได้ (-2, -1, 0, 1, 2).

                ใช้คุณสมบัติ order ในการเปลี่ยนลำดับของเจ้ากบเหล่านี้ตามสีของใบบัว

                ', + 'mn': '

                Заримдаа контейнерийн мөр, баганын дарааллыг өөрчлөх нь хангалтгүй байдаг. Эдгээр тохиолдлуудад бид order пропертийг item бүрт тус тусад нь хэрэглэж болно. Анхны өгөгдмөлөөр items 0 гэсэн утгатай байдагч бид items-д эерэг эсвэл сөрөг (-2, -1, 0, 1, 2) гэх мэт утга оноож ашиглаж болно.

                order пропертийг ашиглан мэлхийнүүдийг сараана цэцэгт нь тохируулан дахин эрэмбэлээрэй.

                ' + }, + board: 'gyr', + selector: '> :nth-child(2)', + classes: { '#pond, #background': 'wrap' }, + style: { 'order': '2' }, + before: "#pond {\n display: flex;\n}\n\n.yellow {\n", + after: "}" + }, + { + name: 'order 2', + instructions: { + 'en': '

                Use the order property to send the red frog to his lilypad.

                ', + 'he': '

                השתמשו ב-order כדי לשלוח את הצפרדע האדומה לעלה שלה.

                ', + 'ro': '

                Folosește proprietatea order pentru a trimite broasca la nufărul ei.

                ', + 'bg': '

                Използвай свойството order, за да изпратиш червеното жабче в негото листо.

                ', + 'de': '

                Benutze die order-Eigenschaft, um den roten Frosch zu seinem Seerosenblatt zu führen.

                ', + 'pt-br': '

                Use a propriedade order para levar o sapo vermelho à sua vitória-régia.

                ', + 'es': '

                Usa la propiedad order para enviar la rana de color rojo a su hoja de lirio.

                ', + 'fr': '

                Utilisez la propriété order pour envoyer la grenouille rouge à son nénuphar.

                ', + 'ru': '

                Используй свойство order, чтобы отправить красного лягушонка на его лилию.

                ', + 'fa': '

                با استفاده از خاصیت order قورباغه قرمز را به نیلوفر آبی خود بفرستید.

                ', + 'zh-cn': '

                用order属性来把红青蛙送回它的荷叶去。

                ', + 'zh-tw': '

                用order屬性來把紅青蛙送回它的荷葉去。

                ', + 'tr': '

                order kuralını kullanarak kırmızı kurbağayı kendi nilüfer yaprağına gönderin.

                ', + 'az': '

                order qaydasını istifadə edərək qırmızı qurbağanı öz zanbaq yarpağına göndərin.

                ', + 'it': '

                Utilizza la proprietà order per muovere le rane sulla loro ninfea.

                ', + 'ko': '

                order 속성을 사용하여 빨간색 개구리를 빨간색 수련잎으로 보내주세요.

                ', + 'lt': '

                Panaudokite komandą order, kad nukeltumėte raudoną varlytę ant jos lelijos lapo.

                ', + 'vi': '

                Sử dụng thuộc tính order để đưa chú ếch màu đỏ đến với lá bông súng của mình.

                ', + 'pl': '

                Użyj własności order, aby posłać czerwoną żabkę na jej listek.

                ', + 'cs': '

                Použijte vlastnost order tak, aby se červená žabka dostala na svůj leknín.

                ', + 'ja': '

                orderプロパティーを使って、赤いカエルを彼の蓮の葉へ送ってください。

                ', + 'hu': '

                Használd az order tualjdonságot hogy a vörös békát a tündérrózsájához küldhesd.

                ', + 'eo': '

                Uzu la order trajton por alvenigi la ruĝan ranon al ĝia nimfeofolio.

                ', + 'sv': '

                Använd order till att flytta den röda grodan till dess blomblad.

                ', + 'uk': '

                Скористайся властивістю order, щоб всадити червоне жабеня на свій лист латаття.

                ', + 'hi': '

                order प्रॉपर्टी का इस्तेमाल कर लाल मेंढकों को उसके लिली के पत्ते तक पहुंचाइये।

                ', + 'sr': '

                Искористи order својство да пошаљеш црвену жабицу на њен локвањ.

                ', + 'bs': '

                Iskoristi order svojstvo da pošalješ crvenu žabicu na njen list.

                ', + 'hr': '

                Iskoristi order svojstvo da pošalješ crvenu žabicu na njen list.

                ', + 'nl': '

                Gebruik de order eigenschap om de rode kikker naar zijn lelieblaadje te sturen.

                ', + 'ta': '

                order property பயன்படுத்தி சிவப்பு தவளை அதன் இலையினை சென்றடைய உதவவும்.

                ', + 'te': '

                ఎర్ర కప్పను అతని లిల్లీప్యాడ్‌కు పంపడానికి order ఆస్తిని ఉపయోగించండి.

                ', + 'ml': '

                order ഉപയോഗിച്ച് ചുവന്ന തവളകളെ താമര ഇലകളിലേക്കു എത്തിക്കുക.

                ', + 'el': '

                Χρησιμοποιήστε την ιδιότητα order για να στείλετε τον κόκκινο βάτραχο στο νούφαρό του.

                ', + 'mk': '

                Користете го order својството да ја пратите црвената жаба до нејзиниот лист.

                ', + 'lv': '

                Lieto order metodi un nosūti sarkano vardulēnu uz savu ūdensrozi.

                ', + 'id': '

                Gunakan order properti untuk mengirimkan katak merah ke lilypadnya.

                ', + 'ar': '

                استخدم خاصية order لنقل الضفدع الاحمر الى ورقة الزنبق الخاصة به.

                ', + 'ca': '

                Utilitza la propietat order per enviar la granota de color vermell al seu nenúfar.

                ', + 'da': '

                Brug egenskaben order til at sende den røde frø hen til den rigtige åkande.

                ', + 'et': '

                Kasuta omadust order, et saata punane konn oma vesiroosilehele

                ', + 'fi': '

                Siirrä punainen sammakko omalle lumpeenlehdelleen order-ominaisuuden avulla.

                ', + 'gl': '

                Usa a propiedade order para levar a rá vermella ata o seu nenúfar.

                ', + 'th': '

                ใช้คุณสมบัติ order เพื่อส่งเจ้ากบแดงไปยังใบบัวของมัน

                ', + 'mn': '

                Улаан мэлхийг сараана цэцэг рүү илгээхийн тулд order пропертийг ашиглана уу.

                ' + }, + board: 'gggrg', + selector: '> :nth-child(4)', + classes: { '#pond, #background': 'wrap' }, + style: { 'order': '-1' }, + before: "#pond {\n display: flex;\n}\n\n.red {\n", + after: "}" + }, + { + name: 'align-self 1', + instructions: { + 'en': '

                Another property you can apply to individual items is align-self. This property accepts the same values as align-items and its value for the specific item.

                ', + 'he': '

                תכונה נוספת שאפשר להחיל על פריטים ספציפיים היא align-self. התכונה הזו מקבלת אותם ערכים כמו align-items רק שהערך שלה חל על פריט ספציפי.

                ', + 'ro': '

                O altă proprietate pe care o poți aplica individual elementelor este align-self. Această proprietate acceptă aceleași valori ca align-items și valoarea ei pentru elementul specific.

                ', + 'bg': '

                Друго свойство, което можеш да приложиш върху отделен елемент е align-self. Това свойство приема същите стойности като code>align-items и неговата стойност за определен елемент.

                ', + 'de': '

                align-self ist eine weitere Eigenschaft für einzelne Elemente. Sie akzeptiert die gleichen Werte wie align-items.

                ', + 'pt-br': '

                Outra propriedade que você pode aplicar para itens individuais é align-self. Esta propriedade aceita os mesmos valores que align-items e seus valores são usados para o item específico.

                ', + 'es': '

                Otra propiedad que puedes aplicar a elementos individuales es align-self. Esta propiedad acepta los mismos valores de align-items y sus valores son usados para un elemento específico

                ', + 'fr': '

                Une autre propriété que vous pouvez appliquer sur des éléments individuels est align-self. Cette propriété accepte les mêmes valeurs que align-items, mais s\'applique seulement à l\'élément ciblé.

                ', + 'ru': '

                Ещё одно свойство, которое ты можешь применить к определенному элементу — это align-self. Это свойство принимает те же значения, что и align-items.

                ', + 'fa': '

                خاصیت دیگری وجود دارد که به شما امکان تراز بندی فردی (یک ایتم) را می دهد، این خاصت align-self نام دارد. مقادیر این خاصیت دقیقا هما مقادیر خاصیت align-items است.

                ', + 'zh-cn': '

                另一个你可以使用的控制单个元素的属性是align-self。这个属性接受和align-items一样的那些值。

                ', + 'zh-tw': '

                另一個你可以使用的控制單個元素的屬性是align-self。這個屬性接受和align-items一樣的那些值。

                ', + 'tr': '

                Öğe başına uygulayabileceğiniz bir başka kural ise align-self\'tir. Bu kural align-items kuralı ile aynı değerleri alır ve bu değeri o öğe için uygular.

                ', + 'az': '

                Fərdi elementə uyğulaya biləcəyiniz bir başqa qayda isə align-self\'dir. Bu qayda align-items qaydası ilə eyni dəyərləri alır və bu dəyəri o element üçün tətbiq edər.

                ', + 'it': '

                Un\'altra proprietà che è possibile applicare ai singoli elementi è align-self. Essa accetta gli stessi valori di align-items.

                ', + 'ko': '

                align-self는 개별 요소에 적용할 수 있는 또 다른 속성입니다. 이 속성은 align-items가 사용하는 값들을 인자로 받으며, 그 값들은 지정한 요소에만 적용됩니다.

                ', + 'lt': '

                Kita komanda, kurią galima pritaikyti pavieniams elementams yra align-self. Ši komanda reaguoja į tas pačias vertes, kaip ir align-items.

                ', + 'vi': '

                Một thuộc tính CSS khác mà bạn có thể áp dụng cho các hạng mục riêng biệt là align-self. Thuộc tính CSS này chấp nhận các giá trị tương tự như align-items và giá trị của nó đối với một hạng mục riêng biệt.

                ', + 'pl': '

                Następną własnością stosowaną wobec każdego elementu z osobna jest align-self. Przyjmuje ona wartości takie same jak align-items, ale ma zastosowanie tylko wobec konkretnego elementu.

                ', + 'cs': '

                Další vlastností, kterou lze nastavit jednotlivým prvkům, je align-self. Tato vlastnost nabývá stejných hodnot jako align-items, ale ovlivňuje jen vybraný prvek.

                ', + 'ja': '

                他にも、個別のアイテムへ設定できるプロパティーとしてalign-selfがあります。このプロパティーはalign-itemsと同じ値を受け付け、指定のアイテムの状態だけを変更します。

                ', + 'hu': '

                Egy másik, szintén az egyes elemekre alkalmazható tulajdonság az align-self. Ez a tulajdonság ugyanazon értékeket veheti fel, mint az align-items és a beállított érték az adott elemre specifikus lesz.

                ', + 'eo': '

                Alia trajto ke oni povas apliki al individuaj elementoj estas align-self. Tiu trajto permesas la samajn valorojn ol align-items kaj ĝia valoro por la specifa elemento.

                ', + 'sv': '

                En annan attribut man kan använda på individuella objekt är align-self. Detta attribut accepterar samma värden som align-items och dess värde är specifikt för objektet.

                ', + 'uk': '

                Ще одна властивість, котру ти зможеш застосувати до окремого елементу - це align-self. Ця властивість набуває тих самих значень, що й align-items.

                ', + 'hi': '

                एक अन्य प्रॉपर्टी align-self जिसे आप प्रत्येक वस्तु पर अलग-अलग लगा सकते हैं। यह प्रॉपर्टी align-items के मान को ही स्वीकार करती है परन्तु किसी विशिष्ट वस्तु के लिए।

                ', + 'sr': '

                Још једно својство које можеш применити на појединачним елементима је align-self. Ово својство прихвата исте вредности као align-items и примењује их на конкретном елементу.

                ', + 'bs': '

                Još jedno svojstvo koje možeš primjeniti na pojedinačnim elementima jealign-self. Ovo svojstvo prihvata iste vrijednosti kao align-items i primenjuje ih na konkretnom elementu.

                ', + 'hr': '

                Još jedno svojstvo koje možeš primijeniti na pojedinačnim elementima jealign-self. Ovo svojstvo prihvaća iste vrijednosti kao align-items i primjenjuje ih na konkretnom elementu.

                ', + 'nl': '

                Een andere eigenschap die je kan toepassen op individuele elementen is align-self. Deze eigenschap aanvaard dezelfde waarden als align-items maar wordt gebruikt om de waarde op individueel niveau te overschrijven.

                ', + 'ta': '

                align-self என்ற மற்றொருproperty பயன்படுத்தி தனிப்பட்ட உருப்படிகளை சீரமைக்கலாம். இந்த property, align-items மதிப்புகளை அப்படியே ஏற்றுக்கொள்ளும்.

                ', + 'te': '

                మీరు వ్యక్తిగత వస్తువులకు వర్తించే మరొక ఆస్తి align-self. ఈ ఆస్తి align-items వలె అదే విలువలను మరియు నిర్దిష్ట వస్తువు కోసం దాని విలువను అంగీకరిస్తుంది.

                ', + 'ml': '

                വ്യക്തിഗത ഇനങ്ങൾക്ക് ഇത് അപ്ലൈ ചെയുവാൻ ആയി align-self ഉപയോഗിക്കാം. ഈ പ്രോപ്പർട്ടി align-items യുടെ അതേ പ്രോപ്പർട്ടീസ് താനെ സ്വീകരിക്കും

                ', + 'el': '

                Μια άλλη ιδιότητα που μπορείτε να εφαρμόσετε σε μεμονωμένα αντικείμενα είναι το align-self. Αυτή η ιδιότητα αποδέχεται τις ίδιες αξίες με το align-items, αλλά ισχύει μόνο για το συγκεκριμένο αντικείμενο.

                ', + 'mk': '

                Друго својство кое што можете да го примените на индивидуални елементи е align-self. Ова својство ги прима истите вредности како и align-items и неговата вредност за определен елемент.

                ', + 'lv': '

                align-self ir vēl viena metode, ko vari piešķirt kādam individuālam elementam. Šī metode pieņem tādas pašas vērtības kā align-items un piešķir šo vērtību attiecīgajam elementam.

                ', + 'id': '

                Properti lain yang dapat kamu terapkan untuk masing-masing objek adalah align-self. Properti ini memiliki nilai yang sama dengan align-items dan nilainya untuk item tertentu.

                ', + 'ar': '

                هناك خاصية اخرى يمكنك تنفيذها على عناصر منفردة وهي align-self. هذه الخاصية تقبل نفسي القيم التي تقبلها align-items وقيمتها لعنصر مخصص فقط.

                ', + 'ca': '

                Una altra propietat que pots aplicar als elements individuals és align-self. Aquesta propietat accepta els mateixos valors de align-items i els seus valors són utilitzats per a un element específic

                ', + 'da': '

                En anden egenskab, der kan bruges på individuelle elementer er align-self. Denne egenskab tager imod de samme værdier som align-items og giver værdien til det specifikke element.

                ', + 'et': '

                Veel üks omadus, mida sa saad rakendada üksikutele elementidele on align-self. Selle omaduse puhul saab kasutada samasid väärtusi nagu align-items ja anda see väärtus kindlale elemendile.

                ', + 'fi': '

                Toinen ominaisuus, jonka voit määrittää yksittäisille elementeille, on align-self. Tälle ominaisuudelle voi antaa samoja arvoja kuin ominaisuudelle align-items, ja se vaikuttaa vain määritettyyn elementtiin.

                ', + 'gl': '

                Outra propiedade que podes aplicar a elementos individuais é align-self. Esta propiedade acepta os mesmos valores ca align-items e aplícase só a un elemento específico.

                ', + 'th': '

                คุณสมบัติอีกอย่างที่คุณสามารถใช้กับ item เฉพาะตัวคือ align-self คุณสมบัตินี้รับค่าเหมือนกันกับ align-items และในการกำหนดค่าให้กับ item เฉพาะตัว

                ', + 'mn': '

                Та тусдаа item-д хэрэглэж болох өөр нэг проперти бол align-self юм. Энэ проперти нь align-items-тай ижил утгуудыг болон тодорхой item-н утгыг хүлээн авдаг.

                ' + }, + board: 'ggygg', + selector: '> :nth-child(3)', + style: { 'align-self': 'flex-end' }, + before: "#pond {\n display: flex;\n align-items: flex-start;\n}\n\n.yellow {\n", + after: "}" + }, + { + name: 'align-self 2', + instructions: { + 'en': '

                Combine order with align-self to help the frogs to their destinations.

                ', + 'he': '

                שלבו את order ואת align-self כדי לעזור לצפרדעים להגיע לעלים שלהן.

                ', + 'ro': '

                Combină order cu align-self pentru a le ajuta pe broaște să ajungă la destinație.

                ', + 'bg': '

                Комбинирай order с align-self, за да помогнеш на жабчетата да достигнат своето местоназначение.

                ', + 'de': '

                Kombiniere order mit align-self, um die Frösche zum Ziel zu bringen.

                ', + 'pt-br': '

                Combine order e align-self para levar os sapos aos seus destinos.

                ', + 'es': '

                Combina order con align-self para ayudar a las ranas a llegar a sus destinos.

                ', + 'fr': '

                Combinez order et align-self pour aider les grenouilles à arriver à destination.

                ', + 'ru': '

                Используй order и align-self вместе, чтобы помочь лягушатам добраться к своим целям.

                ', + 'fa': '

                با استفاده از خاصیت های order و align-self به قورباغه ها کمک کنید به نیلوفر آبی خود برسند.

                ', + 'zh-cn': '

                用order和align-self的组合来帮助青蛙们到它们的目的地。

                ', + 'zh-tw': '

                用order和align-self的組合來幫助青蛙們到它們的目的地。

                ', + 'tr': '

                order kuralını align-self kuralı ile birleştirerek kurbağaları varacakları yere gitmelerine yardımcı olun

                ', + 'az': '

                order qaydasını align-self qaydası ilə birləşdirərək qurbağaların çatacaqları yerə getmələrinə kömək edin

                ', + 'it': '

                Combina order con align-self per aiutare le rane ad arrivare a destinazione.

                ', + 'ko': '

                order와 align-self를 사용하여 개구리들을 자기 색깔과 같은 수련잎 위로 보내주세요.

                ', + 'lt': '

                Panaudokite order ir align-self kombinaciją, kad padėtumėte varlytėms pasiekti savo lelijų lapus.

                ', + 'vi': '

                Kết hợp order với align-self giúp các chú ếch đến đúng địa điểm của chúng.

                ', + 'pl': '

                Pomóż żabkom dotrzeć do listków przy pomocy kombinacji własności order i align-self.

                ', + 'cs': '

                Pomozte žabkám na lekníny kombinací vlastností order a align-self.

                ', + 'ja': '

                orderをalign-selfを組み合わせて、カエルたちを目的地へ連れて行ってあげましょう。

                ', + 'hu': '

                Ötvözd az order és az align-self tulajdonságok erejét, hogy a békák elérjék úticéljukat.

                ', + 'eo': '

                Kombinu order kun align-self por helpi la ranojn iri al iliaj cellokoj.

                ', + 'sv': '

                Kombinera order och align-self för att hjälpa grodorna till sina blomblad.

                ', + 'uk': '

                Скомбінуй order з align-self, щоб допомогти жабенятам дістатися свого призначення.

                ', + 'hi': '

                order एवं align-self का इस्तेमाल करते हुए मेंढकों को उनके गंतव्य तक पहुंचाइये।

                ', + 'sr': '

                Комбинуј order са align-self како би помогао/ла жабицама да стигну до свог циља.

                ', + 'bs': '

                Kombiniraj order sa align-self kako bi pomogao/la žabicama da stignu do svog cilja.

                ', + 'hr': '

                Kombiniraj order sa align-self kako bi pomogao/la žabicama da stignu do svog cilja.

                ', + 'nl': '

                Combineer order met align-self om de kikkers naar hun bestemming te leiden.

                ', + 'ta': '

                order மற்றும் align-self பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

                ', + 'te': '

                కప్పలను వారి గమ్యస్థానాలకు సహాయం చేయడానికి order ను align-self తో కలపండి.

                ', + 'ml': '

                order with align-self ഉപയോഗിച്ച് ഉദ്ധിഷ്ടസ്ഥാനത്തു എത്തിക്കുക.

                ', + 'el': '

                Συνδυάστε το order με το align-self για να βοηθήσετε τους βατράχους να φτάσουν στους προορισμούς τους.

                ', + 'mk': '

                Комбинирајте order со align-self да им помогнете на жабите да стигнат до нивните дестинации.

                ', + 'lv': '

                Kombinē order ar align-self un palīdzi vardulēniem nokļūt līdz saviem mērķiem.

                ', + 'id': '

                Gabungkan order dengan align-self untuk membanntu katak mencapai tujuan mereka.

                ', + 'ar': '

                استخدم order مع align-self لمساعدة الضفادع بالذهاب الى وجهاتهم.

                ', + 'ca': '

                Combina order amb align-self per ajudar a les granotes a arribar a seus destins.

                ', + 'da': '

                Kombiner order med align-self for at hjælpe frøerne til deres destinationer.

                ', + 'et': '

                Kasuta order koos align-self, et aidata konnad oma sihtpunktidesse.

                ', + 'fi': '

                Auta sammakot omille paikoilleen käyttämällä ominaisuuksia order ja align-self yhdessä.

                ', + 'gl': '

                Combina order con align-self para axudar ás rás a chegar ao seu destino.

                ', + 'th': '

                รวมคำสั่ง order กับ align-self เพื่อช่วยเจ้ากบเหล่านี้ไปยังจุดหมาย

                ', + 'mn': '

                Мэлхийнүүдийг зорьсон газарт нь хүргэхийн тулд order-г align-self-тэй хослуулаарай.

                ' + }, + board: 'ygygg', + selector: '> .yellow', + style: { 'align-self': 'flex-end', 'order': '2' }, + before: "#pond {\n display: flex;\n align-items: flex-start;\n}\n\n.yellow {\n", + after: "}" + }, + { + name: 'flex-wrap 1', + instructions: { + 'en': '

                Oh no! The frogs are all squeezed onto a single row of lilypads. Spread them out using the flex-wrap property, which accepts the following values:

                • nowrap: Every item is fit to a single line.
                • wrap: Items wrap around to additional lines.
                • wrap-reverse: Items wrap around to additional lines in reverse.
                ', + 'he': '

                אוי לא! הצפרדעים נדחסו לשורה אחת של עלים. תפזרו אותן בשימוש בתכונה flex-wrap, שמקבלת את הערכים הבאים:

                • nowrap: כל פריט מותאם לשורה אחת.
                • wrap: פריטים "נעטפים" (מתפזרים) כל גבי כמה שורות.
                • wrap-reverse: פריטים "נעטפים" (מתפזרים) על גבי כמה שורות בסדר הפוך.
                ', + 'ro': '

                O nu! Broaștele sunt toate înghesuite pe un singur rând de nuferi. Răspândește-le folosind proprietatea flex-wrap, care acceptă următoarele valori:

                • nowrap: Fiecare element este așezat pe o singură linie.
                • wrap: Elementele se împart pe mai multe linii.
                • wrap-reverse: Elementele se împart pe mai multe linii in ordine inversă.
                ', + 'bg': '

                О не! Всички жабчета са смачкани на един единствен ред. Разделечи ги, използвайки свойството flex-wrap, което приема следните стойности:

                • nowrap: Всеки елемент се ситуира на един ред.
                • wrap: Елементите се подреждат на допълнителни редове.
                • wrap-reverse: Елементите се подреждат на допълнителни редове в обратен ред.
                ', + 'de': '

                Oh nein! Alle Frösche sind in eine Reihe von Seerosenblättern gequetscht. Verteile sie mit der flex-wrap-Eigenschaft, welche die folgenden Werte akzeptiert:

                • nowrap: Alle Elemente in einer einzigen Zeile platzieren.
                • wrap: Elemente auf zusätzliche Zeilen umbrechen.
                • wrap-reverse: Elemente in umgekehrter Reihenfolge auf zusätzliche Zeilen umbrechen.
                ', + 'pt-br': '

                Ah, não! Os sapos estão todos apertados em uma única linha de vitórias-régias. Espalhe-os usando a propriedade flex-wrap, que aceita os seguintes valores:

                • nowrap: Todos os itens são apertados em uma única linha.
                • wrap: Itens se separam em linhas adicionais.
                • wrap-reverse: Itens se separam em linhas adicionais em reverso.
                ', + 'es': '

                ¡Oh, no! Todas las ranas están apretadas en una sola fila de hojas de lirio. Manos a la obra, vamos a distribuirlas correctamente usando la propiedad flex-wrap, la cual acepta los siguientes valores:

                • nowrap: Cada elemento se ajusta en una sola línea.
                • wrap: los elementos se envuelven alrededor de líneas adicionales.
                • wrap-reverse: Los elementos se envuelven alrededor de líneas adicionales en reversa.
                ', + 'fr': '

                Oh non! Les grenouilles sont écrasées dans une seule rangée de nénuphars. Distribuez-les en utilisant la propriété flex-wrap, qui accepte les valeurs suivantes :

                • nowrap : Tous les éléments sont tenus sur une seule ligne.
                • wrap : Les éléments s\'enveloppent sur plusieurs lignes au besoin.
                • wrap-reverse : Les éléments s\'enveloppent sur plusieurs lignes dans l\'ordre inversé.
                ', + 'ru': '

                О нет! Лягушат сплющило на одном ряду лилий. Раздвинь их с помощью свойства flex-wrap, которое принимает следующие значения:

                • nowrap: размеры элементов устанавливаются автоматически, чтобы они поместились в один ряд.
                • wrap: элементы автоматически переносятся на новую строку.
                • wrap-reverse: элементы автоматически переносятся на новую строку, но строки расположены в обратном порядке.
                ', + 'fa': '

                همه قورباغه ها بر روی یک سطر از نیلوفر های آبی به صورت فشرده نشسته اند . با استفاده از خاصیت flex-wrap به آنها کمک کنید, این خاصیت مقادیر ریر را می پذیرد:

                • nowrap: این مقدار پیشفرض است و تمامی آیتم ها در یک خط و در کنار هم قرار می‌گیرند.
                • wrap: با استفاده از این مقدار آیتم ها در چند خط قرار میگیرند.
                • wrap-reverse: این مقدار شبیه به wrap است اما به جای اینکه چیدمان آیتم ها از بالا به پایین باشد از پایین به بالا است.
                ', + 'zh-cn': '

                哦不！这些青蛙都挤到一行了。用flex-wrap属性把它们分散看看。这个属性接受这些值：

                • nowrap: 所有的元素都在一行。
                • wrap: 元素自动换成多行。
                • wrap-reverse: 元素自动换成逆序的多行。
                ', + 'zh-tw': '

                哦不！這些青蛙都擠到一列了。用flex-wrap屬性把它們分散看看。這個屬性接受這些值：

                • nowrap: 所有的元素都在一行。
                • wrap: 元素自動換成多行。
                • wrap-reverse: 元素自動換成逆序的多行。
                ', + 'tr': '

                Olamaz! Tüm kurbağalar tek sıra nilüfer yapraklarına sıkıştılar. flex-wrap kuralını kullanarak onları dağıtın. Bu kural şu değerleri alır:

                • nowrap: Tüm öğeler tek satıra sığar.
                • wrap: Öğeler satırlara bölünür.
                • wrap-reverse: Öğeler satırlara ters sırada bölünür.
                ', + 'az': '

                Ola bilməz! Bütün qurbağalar tək sıra zanbaq yarpaqlarına ilişdilər. flex-wrap qaydasını istifadə edərək onları dağıdın. Bu qayda bu dəyərləri alır:

                • nowrap: Bütün elementlər tək sətirə sığır.
                • wrap: Elementlər sətirlərə bölünür.
                • wrap-reverse: Elementlər sətirlərə tərs sırada bölünür.
                ', + 'it': '

                Oh no! Le rane sono ora tutte schiacciate in una sola riga di ninfee. Dirigile al loro posto utilizzando la proprietà flex-wrap, la quale accetta i seguenti valori:

                • nowrap: Ogni elemento viene sistemato nella stessa riga.
                • wrap: Gli elementi vengono sistemati su più righe se non c\'è spazio per tutti su una sola riga.
                • wrap-reverse: Gli elementi vengono disposti su più righe in ordine inverso.
                ', + 'ko': '

                오 이런! 개구리들이 한 줄 위에 비좁게 앉아있네요. 다음의 값들을 인자로 받는 flex-wrap 속성을 사용하여 개구리들이 넓게 앉을 수 있도록 해주세요:

                • nowrap: 모든 요소들을 한 줄에 정렬합니다.
                • wrap: 요소들을 여러 줄에 걸쳐 정렬합니다.
                • wrap-reverse: 요소들을 여러 줄에 걸쳐 반대로 정렬합니다.
                ', + 'lt': '

                O ne! Varlytės susispaudė vienoje lelijų lapų eilėje. Paskirstykite jas taip, kad kiekviena turėtų savo lelijos lapą. Naudokite komandą flex-wrap, kuri reaguoja į šias vertes:

                • nowrap: Visi elementai sutalpinami vienoje eilutėje.
                • wrap: Elementai talpinami keliose eilutėse.
                • wrap-reverse: Elementai talpinami keliose eilutėse atvirkštine tvarka.
                ', + 'vi': '

                Ồ không! Những chú ếch đều được dồn vào một hàng duy nhất theo các lá bông súng. Tách rời chúng ra bằng cách sử dụng thuộc tính flex-wrap, thuộc tính này chấp nhận các giá trị sau:

                • nowrap: Mỗi hạng mục được dồn vào một hàng duy nhất.
                • wrap: Các hạng mục quấn xung quanh để tạo thêm dòng.
                • wrap-reverse: Các hạng mục quấn xung quanh để tạo thêm dòng ngược lại.
                ', + 'pl': '

                O, nie! Żabki są ściśnięte w jednym wierszu. Rozprosz je przy pomocy własności flex-wrap, która przyjmuje wartości:

                • nowrap: Każdy element dopasowuje się do pojedynczego wiersza.
                • wrap: Elementy wystające przechodzą do kolejnych linii.
                • wrap-reverse: Elementy wystające do kolejnych linii w odwrotnej kolejności.
                ', + 'cs': '

                Ale ne! Všechny žabky se tísní na jednom řádku. Rozprostřete je vlastností flex-wrap, která nabývá následujících hodnot:

                • nowrap: Všechny prvky na jednen řádek.
                • wrap: Umožňuje zalomení na více řádků.
                • wrap-reverse: Umožňuje zalomení, ale v opačném směru.
                ', + 'ja': '

                おやおや、カエルたちが一列の蓮の葉の上で窮屈そうにしていますね。flex-wrapプロパティーを使って、彼らを広げてあげてください。このプロパティーは以下の値を取ります。

                • nowrap: 全てのアイテムは、ひとつの行にフィットします。
                • wrap: アイテムは他の行へ折り返します。
                • wrap-reverse: アイテムは逆順になって他の行へ折り返します。
                ', + 'hu': '

                Jajj, ne! A békák mind rápréselődtek egyetlen sor tündérrózsára. Oszlasd el őket a flex-wrap tulajdonság használatával, amely a következő értékeket veheti fel:

                • nowrap: Minden elem egyetlen sorba tömörödik.
                • wrap: Az elemek további sorokba törnek.
                • wrap-reverse: Az elemek további sorokba törnek fordított irányban.
                ', + 'eo': '

                Ve! Ĉiuj ranoj estas premitaj sur nuran vicon de akvolilifolioj. Sternu ilin pere de la flex-wrap trajto, kiu akceptas la sekvajn valorojn:

                • nowrap: Ĉiuj elementoj laŭmezuras al unuopa linio.
                • wrap: Elementoj faldas ĉirkaŭe al pluaj linioj.
                • wrap-reverse: Elementoj faldas ĉirkaŭe al pluaj linioj je inversa ordo.
                ', + 'sv': '

                Åh nej! Alla grodorna är ihopklämnda på en och samma rad. Sprid ut dom genom att använda flex-wrap, vilket accepterar följande värden:

                • nowrap: Alla objekt är placerade på en enkel rad.
                • wrap: Objekten spiller över till flera rader.
                • wrap-reverse: Objekten splller över till flera rader i omvänd ordning.
                ', + 'uk': '

                Ой ні! Всі жабенята опинилися стиснутими в одному рядку. Розсади їх по місцях, за допомогою властивостіflex-wrap, яка набуває таких значень:

                • nowrap: Кожен елемент буде розташований один за одним в одному рядку. Ширина елементів встановлюється автоматично, щоб вміститись в рядок.
                • wrap: Елементи переносятся до наступного рядка.
                • wrap-reverse: Елементи переносятся до наступного рядка у зворотньому порядку.
                ', + 'hi': '

                अरे नहीं! सभी मेंढक एक ही पंक्ति में चिपक गए हैं। flex-wrap प्रॉपर्टी द्वारा उन्हें फैलाइये, यह निम्न मान स्वीकार करता है:

                • nowrap: प्रत्येक वस्तु एक ही पंक्ति में समायोजित करता है।
                • wrap: वस्तुएं अतिरिक्त पंक्तियों में समायोजित हो जाती हैं।
                • wrap-reverse: वस्तुएं अतिरिक्त पंक्तियों में समायोजित होती हैं।
                ', + 'sr': '

                Ох не! Све жабице су се нагурале у један ред са локвањима. Дај им простора користећи flex-wrap својство, које прихвата следеће вредности:

                • nowrap: Сви елементи стају у један ред.
                • wrap: Елементи прелазе у следеће редове.
                • wrap-reverse: Елементи прелазе у следеће редове у обрнутом редоследу.
                ', + 'bs': '

                Oh ne! Sve žabice su se nagurale u jedan red sa listovima. Daj im prostora koristeći flex-wrap svojstvo, koje prihvata sljedeće vrijednosti:

                • nowrap: Svi elementi se uklapaju u jedan red.
                • wrap: Elementi prelaze u sljedeće redove.
                • wrap-reverse: Elementi prelaze u sljedeće redove u obrnutom redoslijedu.
                ', + 'hr': '

                O ne! Sve žabice su se nagurale u jedan red sa listovima. Daj im prostora koristeći flex-wrap svojstvo, koje prihvaća sljedeće vrijednosti:

                • nowrap: Svi elementi se uklapaju u jedan red.
                • wrap: Elementi prelaze u sljedeće redove.
                • wrap-reverse: Elementi prelaze u sljedeće redove u obrnutom redoslijedu.
                ', + 'nl': '

                Oh nee! De kikkers zitten allemaal samengepakt op een enkele rij van lelieblaadjes. Verspreid ze door de flex-wrap eigenschap te gebruiken, deze aanvaard de volgende waarden:

                • nowrap: Alle elementen worden samengepakt op een enkele lijn.
                • wrap: Elementen worden over meerdere lijnen gewikkeld.
                • wrap-reverse: Elementen worden over meerdere lijnen in omgekeerde richting gewikkeld.
                ', + 'ta': '

                அய்யகோ! அனைத்து தவளைகளும் ஒரே வரிசையில் உள்ள இலைகளில் அமுக்கப்பட்டுள்ளன. flex-wrap property பயன்படுத்தி அவைகளுக்கிடையே இடைவெளி விடவும். மேலும் இது கீழ்கண்ட மதிப்புகளை ஏற்றுக்கொள்ளும்:

                • nowrap: ஒவ்வொரு உருப்படியம் ஒற்றை வரியில் சீரமைக்கப்படும்.
                • wrap: பொருட்கள் கூடுதல் வரியில் அமையுமாறு சீரமைக்கப்படும்.
                • wrap-reverse: பொருட்கள் கூடுதல் வரியில், எதிர் திசையில் அமையுமாறு சீரமைக்கப்படும்.
                ', + 'te': '

                అరెరే! కప్పలు అన్నీ ఒకే వరుస లిల్లీప్యాడ్స్‌పైకి వెళ్లిపోయాయి. flex-wrap ఆస్తిని ఉపయోగించి వాటిని విస్తరించండి, ఈ CSS ఆస్తి ఈ క్రింది విలువలను అంగీకరిస్తుంది:

                • nowrap: ప్రతి అంశం ఒకే పంక్తికి సరిపోతుంది .
                • wrap: అంశాలు అదనపు పంక్తులతో చుట్టబడతాయి.
                • wrap-reverse: అంశాలు రివర్స్‌లోని అదనపు పంక్తులకు చుట్టబడతాయి .
                ', + 'ml': '

                അയ്യോ! തവളകൾ അലാം ഒരേ വഴിയിൽ പെറ്റു പോയി. flex-wrap ഉപയോഗിച്ച് അവരെ നീക്കി നിർത്തു.

                • nowrap: ഓരോ ഇനവും ഒരൊറ്റ വരിയ്ക്ക് അനുയോജ്യമാണ്.
                • wrap: ഇനങ്ങൾ അധിക വരികളിലേക്ക് പൊതിയുക.
                • wrap-reverse: പിൻവലിക്കിലെ കൂടുതൽ വരികളിലേക്ക് ഇനങ്ങൾ സഞ്ചരിക്കുന്നു.
                ', + 'el': '

                Ωχ όχι! Όλοι οι βάτραχοι συμπιέζονται σε μία σειρά νουφάρων. Απλώστε τους χρησιμοποιώντας την ιδιότητα flex-wrap, που αποδέχεται τις εξής αξίες:

                • nowrap: Όλα τα αντικείμενα τοποθετούνται σε μία μόνο γραμμή.
                • wrap: Τα αντικείμενα τυλίγονται σε επιπρόσθετες γραμμές.
                • wrap-reverse: Τα αντικείμενα τυλίγονται σε επιπρόσθετες γραμμές με αντίστροφη σειρά.
                ', + 'mk': '

                О не! Сите жабите се смачкани на еден единствен ред од листови. Распределете ги со користење на flex-wrap својството, кое што ги прима следните вредности:

                • nowrap: Секој елемент опфаќа еден ред.
                • wrap: Елементите се подредуваат во дополнителни редови.
                • wrap-reverse: Елементите се подредуваат во дополнителни редови во обратен редослед.
                ', + 'lv': '

                Ak nē! Visi vardulēni ir iespiesti vienā ūdensrožu rindā. Lietojot flex-wrap metodi, palīdzi tiem izplesties. Šī metode pieņem sekojošas vērtības :

                • nowrap: Katrs elements ir iespiests vienā līnijā.
                • wrap: Elementi tiek izvietoti pa pieejamajām līnijām.
                • wrap-reverse: Elementi apgrieztā secībā tiek izvietoti pa pieejamajām līnijām.
                ', + 'id': '

                Oh tidak! Semua katak bersesakan dalam satu lilypads. Sebarkan mereka dengan menggunakan flex-wrap properti, yang menerima nilai-nilai berikut:

                • nowrap: Setiap objek pada satu baris.
                • wrap: Objek membungkus ke baris tambahan.
                • wrap-reverse: Objek membungkus ke garis tambahan wrap secara terbalik.
                ', + 'ar': '

                للاسف ! تم وضع جميع الضفادع على صف واحد من اوراق الزنبق. افصلهم باستخدام خاصية flex-wrap , التي تقبل القيم التالية:

                • nowrap: توضع جميع العناصر في سطر واحد.
                • wrap: تتمدد العناصر الى باقي السطور.
                • wrap-reverse: تتمدد العناصر الى باقي السطور بشكل معكوس.
                ', + 'ca': '

                Oh, no! Totes les granotes estan apretades en una sola fila de nenúfars. Anem a distribuir-les correctament utilitzant la propietat flex-wrap, que accepta els següents valors:

                • nowrap: Cada element s\'ajusta en una sola línia.
                • wrap: els elements s\'envolten de línies adicionals.
                • wrap-reverse: Els elements s\'envolten de línies adicionals invertides.
                ', + 'da': '

                Åh nej! Frøerne er mast sammen på en enkelt række åkander. Fordel dem med egenskaben flex-wrap, som tager imod følgende værdier:

                • nowrap: Alle elementer tvinges ind på en enkelt linje.
                • wrap: Elementer fordeles på flere linjer.
                • wrap-reverse: Elementer fordeles på flere linjer i omvendt rækkefølge.
                ', + 'et': '

                Oh ei! Kõik konnad on pressitud ühele reale. Jaota nad laiali kasutades flex-wrap omadust, millele saab anda järgmisi väärtusi:

                • nowrap: Kõik elemendid on paigutatud ühele reale.
                • wrap: elemendid on pakitud ümber eraldi joonte.
                • wrap-reverse: Elemendid on pakitud ümber eraldi joonte aga vastupidises järjekorras.
                ', + 'fi': '

                Voi ei! Sammakot ovat ahtautuneet samalle riville. Auta niitä levittäytymään flex-wrap-ominaisuuden avulla. Sille voi antaa jonkin seuraavista arvoista:

                • nowrap: Kaikki elementit sovitetaan yhdelle riville.
                • wrap: Elementit jakautuvat tarvittaessa useammalle riville.
                • wrap-reverse: Elementit jakautuvat useammalle riville käänteisessä järjestyksessä.
                ', + 'gl': '

                Vaia! As rás están todas apertadas nunha única fila de nenúfares. Distribúeas empregando a propiedade flex-wrap, que acepta os seguintes valores:

                • nowrap: Todos os elementos axústanse nunha única liña.
                • wrap: Os elementos distribúense en liñas adicionais.
                • wrap-reverse: Os elementos distribúense en liñas adicionais invertidas.
                ', + 'th': '

                แย่แล้ว! เจ้ากบทั้งหลายถูกบีบให้อยู่ในใบบัวแถวเดียวกัน กระจายมันออกไปด้วยคุณสมบัติ flex-wrap ซึ่งรับค่าดังต่อไปนี้:

                • nowrap: ทุกๆ item จะถูกวางไว้ในแถวเดียวกัน
                • wrap: items ที่เกินจะพับลงไปบรรทัดใหม่
                • wrap-reverse: items ที่เกินจะพับลงไปบรรทัดใหม่ และเรียงกลับด้าน
                ', + 'mn': '

                Өө үгүй ээ! Мэлхийнүүд бүгд ганцхан эгнээн дэх сараана цэцэгс дээр шахагдсан байна. Дараах утгуудыг хүлээн авах flex-wrap пропертийг ашиглан тэдгээрийг тараагаарай:

                • nowrap: Бүх items-г нэг мөрөнд багтаах.
                • wrap: Зарим items-г нэмэлт мөрүүд рүү илгээх.
                • wrap-reverse: Зарим items-г урвуу дараалалаар нэмэлт мөрүүд рүү илгээх.
                ' + }, + board: 'ygggggr', + style: { 'flex-wrap': 'wrap' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-wrap 2', + instructions: { + 'en': '

                Help this army of frogs form three orderly columns using a combination of flex-direction and flex-wrap.

                ', + 'he': '

                עזרו לצבא הצפרדעים הזה להסתדר בשלוש עמודות מסודרות בשימוש ב-flex-direction וב-flex-wrap.

                ', + 'ro': '

                Ajută această armată de broaște să formeze trei coloane ordonate folosind o combinație de flex-direction și flex-wrap.

                ', + 'bg': '

                Помогни на тази армия от жабчета да формира три подредени колони, използайки комбинация от flex-direction и flex-wrap.

                ', + 'de': '

                Hilf dieser Frosch-Armee, mit flex-direction und flex-wrap drei ordentliche Spalten zu formen.

                ', + 'pt-br': '

                Ajude esse exército de sapos a formar três colunas ordenadas usando uma combinação de flex-direction e flex-wrap.

                ', + 'es': '

                Ayuda a este ejército de ranas a ordenarse en tres columnas usando una combinación de flex-direction y flex-wrap.

                ', + 'fr': '

                Aidez cette armée de grenouille à former trois belles colonnes en utilisant une combinaison de flex-direction et flex-wrap.

                ', + 'ru': '

                Помоги этой армии лягушат выстроиться в три колонки с помощью комбинации flex-direction и flex-wrap.

                ', + 'fa': '

                به ارتش قورباغه ها کمک کنید تا به صورت منظم در ستون های خود قرار بگیرند با استفاده از خاصیت های flex-direction و flex-wrap این کار را انجام دهید.

                ', + 'zh-cn': '

                帮这些青蛙们排成整齐的三列。使用flex-direction和flex-wrap的组合。

                ', + 'zh-tw': '

                幫這些青蛙們排成整齊的三行。使用flex-direction和flex-wrap的組合。

                ', + 'tr': '

                flex-direction ve flex-wrap kombinasyonunu kullanarak bu kurbağa ordusunun üçlü sıralı düzene girmesine yardımcı olun.

                ', + 'az': '

                flex-direction və flex-wrap kombinasiyasını istifadə edərək bu qurbağa ordusunun üç sıralı hala düşməsinə kömək edin.

                ', + 'it': '

                Aiuta questo gruppo di rane a disporsi in tre colonne ordinate usando in combinazione flex-direction e flex-wrap.

                ', + 'ko': '

                flex-direction과 flex-wrap을 사용하여 개구리들이 세 column에 정렬할 수 있도록 도와주세요.

                ', + 'lt': '

                Padėkite šiai varlyčių armijai išsirikiuoti trimis tvarkingais stulpeliais naudodami flex-direction ir flex-wrap komandų kombinaciją.

                ', + 'vi': '

                Giúp đội quân ếch xếp thành ba hàng trật tự bằng cách kết hợp flex-direction và flex-wrap.

                ', + 'pl': '

                Pomóż tej zgrai żabek utworzyć trzy uporządkowane kolumny używając własności flex-direction oraz flex-wrap.

                ', + 'cs': '

                Pomozte žabkám utvořiy tři zástupy pomocí flex-direction a flex-wrap.

                ', + 'ja': '

                flex-directionとflex-wrapを使って、このカエルの大群がきちんと三列に並ぶようにしてあげてください。

                ', + 'hu': '

                Segítsd ezt a békahadsereget, hogy három szabályos oszlop alakzatba rendeződjenek a flex-direction és a flex-wrap használatának ötvözésével.

                ', + 'eo': '

                Helpu tiun ĉi aron da ranoj formi tri ordigotajn kolumojn uzante kombinon de flex-direction kaj flex-wrap.

                ', + 'sv': '

                Hjälp en hel drös av grodor att ställa sig i tre raka kolumner genom att använda en kombination av flex-direction och flex-wrap.

                ', + 'uk': '

                Допоможи армії жаб сформувати три однакові стовпці, за допомогою комбінації властивостей flex-direction та flex-wrap.

                ', + 'hi': '

                मेंढकों की सेना को flex-direction एवं flex-wrap के इस्तेमाल से तीन स्तम्भ बनाने में मदद कीजिये।

                ', + 'sr': '

                Помози овој војсци жабица да формира три колоне користећи комбинацију flex-direction и flex-wrap.

                ', + 'bs': '

                Pomozi ovoj vojsci žabica da formira tri kolone koristeći kombinaciju flex-direction i flex-wrap.

                ', + 'hr': '

                Pomozi ovoj vojsci žabica da formira tri kolone koristeći kombinaciju flex-direction i flex-wrap.

                ', + 'nl': '

                Help dit legertje kikkers om drie ordelijke kolommen te vormen, maak hiervoor gebruik van een combinatie van flex-direction en flex-wrap.

                ', + 'ta': '

                flex-direction மற்றும் flex-wrap பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

                ', + 'te': '

                ఈ కప్పల సైన్యం కి flex-direction మరియు flex-wrap కలయికను ఉపయోగించి మూడు క్రమమైన నిలువు వరుసలను రూపొందించడంలో సహాయపడండి.

                ', + 'ml': '

                flex-direction and flex-wrap. ഉപയോഗിച്ച് മൂന്നു ക്രമമായ നിരകൾ ഉണ്ടാക്കുക

                ', + 'el': '

                Βοηθήστε αυτή την στρατιά βατράχων να διαμορφώσει τρεις τακτικές στήλες χρησιμοποιώντας έναν συνδυασμό του flex-direction και του flex-wrap.

                ', + 'mk': '

                Помогнете ѝ на оваа армија од жаби да формира три подредени колони со користење на комбинација од flex-direction и flex-wrap.

                ', + 'lv': '

                Palīdzi vardulēnu armijai izveidot trīs vienādas kolonnas. Sakombinē kopā flex-diraction un flex-wrap metodes.

                ', + 'id': '

                Bantu pasukan katak ini kedalam 3 baris berurutan menggunakan kombinasi flex-direction dan flex-wrap.

                ', + 'ar': '

                ساعد هذا الجيش من الضفادع للاصطفاف في ثلاث اعمدة منظمة باستخدام كل من flex-direction و flex-wrap.

                ', + 'ca': '

                Ajuda aquest exèrcit de granotes a ordenar-se en tres columnes utilitzant una combinació de flex-direction i flex-wrap.

                ', + 'da': '

                Hjælp denne hær af frøer med at stille sig i tre pæne kolonner med en kombination af flex-direction og flex-wrap.

                ', + 'et': '

                Aita see konnade armee kolmelt korrastatud veerult ära kasutades nii flex-direction, kui ka flex-wrap.

                ', + 'fi': '

                Auta tätä sammakkoarmeijaa muodostamaan kolme siistiä pystysuuntaista riviä käyttämällä ominaisuuksia flex-direction ja flex-wrap.

                ', + 'gl': '

                Axuda a este exército de rás a formar tres columnas ordeadas botando man de flex-direction e flex-wrap.

                ', + 'th': '

                ช่วยกองทัพเจ้ากบตั้งแถวหน้ากระดานเรียงสาม โดยใช้คำสั่ง flex-direction และ flex-wrap.

                ', + 'mn': '

                Энэ мэлхийн армид flex-direction болон flex-wrap-н хослолыг ашиглан эмх цэгцтэй гурван багана үүсгэхэд тусална уу.

                ' + }, + board: 'gggggrrrrryyyyy', + style: { 'flex-direction': 'column', 'flex-wrap': 'wrap' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'flex-flow 1', + instructions: { + 'en': '

                The two properties flex-direction and flex-wrap are used so often together that the shorthand property flex-flow was created to combine them. This shorthand property accepts the value of the two properties separated by a space.

                For example, you can use flex-flow: row wrap to set rows and wrap them.

                Try using flex-flow to repeat the previous level.

                ', + 'he': '

                שתי התכונות flex-direction ו-flex-wrap משומשות כל כך הרבה ביחד שהתכונה המקוצרת flex-flow נוצרה כדי לשלב בינהן. התכונה המקוצרת הזו מקבלת ערכים של שתי התכונות, מופרדים על ידי רווח.

                לדוגמא, אפשר להשתמש ב-flex-flow: row wrap כדי להגדיר שורות ולעטוף אותן.

                נסו להשתמש ב-flex-flow כדי לעשות שוב את הרמה הקודמת.

                ', + 'ro': '

                Cele două proprietăți flex-direction și flex-wrap sunt folosite așa de des împreună încăt prescurtarea flex-flow a fost creată să le combine. Această prescurare acceptă valoarea uneia din cele două proprietăți separate de un spați.

                De exemplu, poți să folosești flex-flow: row wrap pentru a seta rânduri si pentru a le împărți pe mai multe linii.

                Incearcă să folosești flex-flow pentru a repeta nivelul anterior.

                ', + 'bg': '

                Двете свойства flex-direction и flex-wrap се използват толкова често заедно, че е създадено свойството flex-flow, за да ги комбинира. Това съкратено свойство приема стойността на едно от двете свойства разделени с интервал.

                Например, можеш да използвашflex-flow: row wrap, за да определиш редове и да ги подредиш.

                Опитай да използваш flex-flow и да повториш предишното ниво.

                ', + 'de': '

                Die beiden Eigenschaften flex-direction und flex-wrap werden so oft gemeinsam verwendet, dass sie über die Kurzschreibweise flex-flow kombiniert werden können. Diese akzeptiert, durch ein Leerzeichen getrennt, die Werte beider Eigenschaften.

                Du kannst zum Beispiel flex-flow: row wrap benutzen, um umbrechende Zeilen zu verwenden.

                Versuche das vorige Level einmal mit flex-flow.

                ', + 'pt-br': '

                As duas propriedades flex-direction e flex-wrap são usadas tão frequentemente juntas que uma propriedade abreviada flex-flow foi criada para combiná-las. Essa propriedade aceita o valor das duas propriedades separados por um espaço.

                Por exemplo, você pode usar flex-flow: row wrap para aplicar a direção de linha e quebrar em múltiplas linhas.

                Tente usar flex-flow para refazer o nível anterior.

                ', + 'es': '

                Las dos propiedades flex-direction y flex-wrap son usadas a menudo en conjunto con la propiedad abreviada flex-flow, la cual fue creada para combinarlas. Esta propiedad abreviada, acepta un valor de cada una separada por un espacio.

                Por ejemplo, puedes usar flex-flow para establecer filas y envolverlas.

                Trata de usar flex-flow para volver a realizar el nivel anterior.

                ', + 'fr': '

                Les deux propriétés flex-direction et flex-wrap sont utilisées tellement souvent ensembles que le raccourci flex-flow a été créé pour les combiner. Ce raccourci accepte les valeurs des deux propriétés séparées par un espace.

                Par exemple, vous pouvez utiliser flex-flow: row wrap pour configurer les colonnes et les faire s\'envelopper.

                Essayez d\'utiliser flex-flow pour répéter le niveau précédent.

                ', + 'ru': '

                Два свойства flex-direction и flex-wrap используются так часто вместе, что было создано свойство flex-flow для их комбинирования. Это свойство принимает их значения, разделённые пробелом.

                Например, ты можешь использовать flex-flow: row wrap, чтобы элементы располагались в ряд и автоматически переносились на новую строку.

                Попробуй использовать flex-flow, чтобы повторить предыдущий уровень.

                ', + 'fa': '

                مطمئنا با قابلیت مختصر نویسی در css آشنا هستید شما می توانید خاصیت های flex-direction و flex-wrap را در خاصیت flex-flow بنویسید.

                برای مثال, شما می توانید برای این خاصیت به این صورت flex-flow: row wrap مقدار دهید.

                دوباره برای مرحله قبل از خاصیت flex-flow استفاده کنید.

                ', + 'zh-cn': '

                flex-direction和flex-wrap两个属性经常会一起使用，所以有缩写属性flex-flow。这个缩写属性接受两个属性的值，两个值中间以空格隔开。

                举个例子，你可以用flex-flow: row wrap去设置行并自动换行。

                试着用flex-flow来重复上一关的任务。

                ', + 'zh-tw': '

                flex-direction和flex-wrap兩個屬性經常會一起使用，所以有縮寫屬性flex-flow。這個縮寫屬性接受兩個屬性的值，兩個值中間以空格隔開。

                舉個例子，你可以用flex-flow: row wrap去設置列並自動換行。

                試著用flex-flow來重復上一關的任務。

                ', + 'tr': '

                flex-direction ve flex-wrap kuralları, flex-flow kısa yazım kuralı ile birlikte yazılabilirler. Bu kısa yazım kuralı, iki kuralın değerlerini aralarında boşluk ile birlikte alır.

                Örneğin, flex-flow: row wrap kuralı ile row ve wrap değerlerini aynı anda verebilirsiniz.

                flex-flow kuralını kullanarak bir önceki seviyeyi tekrar edin.

                ', + 'az': '

                flex-direction və flex-wrap qaydaları, flex-flow qısa yazı qaydası ilə birlikdə yazıla bilirlər. Bu qısa yazı qaydası, iki qaydanın dəyərlərini aralarında boşluq ilə birlikdə alır.

                Məsələn, flex-flow: row wrap qaydası ilə row və wrap dəyərlərini eyni anda verə bilərsiniz.

                flex-flow qaydasını istifadə edərək bir öncəki səviyyəni təkrar edin.

                ', + 'it': '

                Le due proprietà flex-direction e flex-wrap sono usate così di frequente che è stata creata la proprietà flex-flow, che combina le due proprietà assieme. Questa proprietà accetta un valore per ognuna delle due proprietà separati da uno spazio.

                Per esempio, puoi utilizzare flex-flow: row wrap per impostare righe e wrap.

                Ripeti il livello precedente utilizzando flex-flow.

                ', + 'ko': '

                flex-direction과 flex-wrap이 자주 같이 사용되기 때문에, flex-flow가 이를 대신할 수 있습니다. 이 속성은 공백문자를 이용하여 두 속성의 값들을 인자로 받습니다.

                예를 들어, 요소들을 가로선 상의 여러줄에 걸쳐 정렬하기 위해 flex-flow: row wrap을 사용할 수 있습니다.

                flex-flow를 사용하여 이전 단계를 반복해보세요.

                ', + 'lt': '

                Dvi komandos, flex-direction ir flex-wrap, kartu yra naudojamos taip dažnai, kad buvo sukurta sutrumpinta komanda flex-flow, kuri apjungė jas abi. Ši sutrumpinta komanda reaguoja į dvi atskirų komandų vertes atskirtas tarpu.

                Pavyzdžiui, galite naudoti flex-flow: row wrap, kad nustatytumėte eilučių rikiavimo būdą ir talpintumėte elementus daugiau nei vienoje eilutėje.

                Pabandykite naudoti flex-flow, kad pasiektumėte ankstesnio lygio rezultatą.

                ', + 'vi': '

                Cả hai thuộc tính flex-direction và flex-wrap thường được sử dụng với nhau vì thế từ viết tắt flex-flow được tạo ra để kết hợp chúng. Từ viết tắt này chấp nhận giá trị của một trong hai thuộc tính ngăn cách bởi một khoảng trắng.

                Ví dụ, bạn có thể sử dụng flex-flow: row wrap để thiết lập hàng ngang và quấn xung quanh chúng.

                Thử sử dụng flex-flow để lặp lại cấp độ trước đó.

                ', + 'pl': '

                Jednoczesne zastosowanie własności flex-direction i flex-wrap występuje bardzo często, dlatego też utworzono własność skrótową flex-flow. Przyjmuje ona dwie wartości rozdzielone spacją.

                Na przykład: wpisując flex-flow: row wrap uzyskamy efekt ułożenia elementów w wierszu i zawijanie ich do kolejnych linii w przypadku gdy któryś wystawałby poza kontener.

                Spróbuj powtórzyć efekt z poprzedniego zadania przy pomocy flex-flow.

                ', + 'cs': '

                Protože vlastnosti flex-direction a flex-wrap se často používají najednou, byla přidána vlastnost flex-flow, která je kombinuje. Tato vlastnost akceptuje hodnoty obou, oddělené mezerou.

                Například můžete napsat flex-flow: row wrap pro zalamování ve sloupcích.

                Zkuste nyní předchozí úkol vyřešit pomocí flex-flow.

                ', + 'ja': '

                flex-directionとflex-wrapの二つのプロパティーはよく一緒に使われます。そこで、これらを統合するショートハンドプロパティーflex-flowが作られました。このショートハンドプロパティーは空白文字で分割した二つのプロパティーの値を受け付けます。

                例えば、flex-flow: row wrapとすることで、並び方と折り返し方を指定することができます。

                試しに、flex-flowを使ってさっきの問題をやり直してみましょう。

                ', + 'hu': '

                A flex-direction és a flex-wrap tulajdonságok olyan gyakran használatosak együtt, hogy létrejött a rövidítésükként és ötvözésükként szolgáló flex-flow tulajdonság. Ez az egyszerűsített tulajdonság a két másik tulajdonság értékei közül kaphat értékeket, melyeket egymástól space (szóköz) választ el.

                Például használhatod a flex-flow: row wrap kódot, hogy betördelt sorokat kapj.

                Próbáld ki a flex-flow használatát az előző feladvány megoldására.

                ', + 'eo': '

                La du trajtoj flex-direction kaj flex-wrap kune uzatas tiom frekvente kiom la mallongiga trajto flex-flow estis kreata por unuigi ilin. Tiu mallongiga trajto permesas la valoron de unu el la du trajtoj apartigataj per spaco.

                Ekzemple, oni povuzas flex-flow: row wrap por meti viciojn kaj faldi ilin.

                Provu uzi flex-flow por ripeti la antaŭan nivelon.

                ', + 'sv': '

                De två attributen flex-direction och flex-wrap används så ofta tillsammans att en kort version kallad flex-flow skapades för att kombinera dem. Denna korta version accepterar värdena från de två attributen separerade med ett blanksteg.

                Till exempel kan du använda flex-flow: row wrap för att sätta rader och få dom att flöda över.

                Testa att använda flex-flow för att repetera den föregående nivån.

                ', + 'uk': '

                Дві властивості flex-direction та flex-wrap найчастіше використовуються разом, тому існує скорочена властивість flex-flow, що обʼєднує їх. Ця властивість приймає одне значення кожної з властивостей, які відокремлені пробілом.

                Наприклад, ви можете застосувати flex-flow: row wrap для встановлення рядків та перенесення їх.

                Спробуй скористатися flex-flow для повторення попереднього рівня.

                ', + 'hi': '

                flex-direction एवं flex-wrap अक्सर इस्तेमाल किये जाते हैं इसलिए flex-flow नयी प्रॉपर्टी इनको मिला कर बनाई गयी। यह प्रॉपर्टी इन दोनों में से किसी प्रॉपर्टी के मानों को ग्रहण करती है जो की सामान अंतर में लिखी गयी हों।

                उदाहरण के लिए, हम flex-flow: row wrap का इस्तेमाल हम वस्तुओं को अनेक प्पंक्तियों में लाने के लिए कर सकते हैं।

                flex-flow का इस्तेमाल पिछले स्तर को पार करने में कीजिये।

                ', + 'sr': '

                Два својства flex-direction и flex-wrap се јако често користе заједно па је скраћено својство flex-flow креирано да их искомбинује. Ово скраћено својство прихвата две вредности које куцамо одвојено.

                На пример, можеш користити flex-flow: row wrap да дефинишеш редове са преломом.

                Пробај да користиш flex-flow како би поновио претходни ниво.

                ', + 'bs': '

                Dva svojstva flex-direction i flex-wrap se jako često koriste zajedno pa je skraćeno svojstvo flex-flow kreirano da ih iskombinuje. Ovo skraćeno svojstvo prihvata dvije vrijednosti koje kucamo odvojeno.

                Na primjer, možeš koristiti flex-flow: row wrap da definišeš redove sa prelomom.

                Probaj da koristiš flex-flow kako bi ponovio prethodni nivo.

                ', + 'hr': '

                Dva svojstva flex-direction i flex-wrap se jako često koriste zajedno pa je skraćeno svojstvo flex-flow kreirano da ih iskombinira. Ovo skraćeno svojstvo prihvaća dvije vrijednosti koje kucamo odvojeno.

                Na primjer, možeš koristiti flex-flow: row wrap da definiraš redove sa prijelomom.

                Probaj koristiti flex-flow kako bi ponovio prethodni nivo.

                ', + 'nl': '

                De twee eigenschappen flex-direction en flex-wrap worden zodanig veel in combinatie met elkaar gebruikt dat men er een verkorte eigenschap flex-flow voor heeft gemaakt. Deze verkorte eigenschap aanvaardt de waarde(n) van deze twee eigenschappen gescheiden door een spatie.

                Zo kan je bijvoorbeeld flex-flow: row wrap gebruiken om een omwikkelende rij te maken.

                Probeer flex-flow eens te gebruiken om het vorige niveau te herhalen.

                ', + 'ta': '

                flex-direction மற்றும் flex-wrap properties அடிக்கடி ஒன்றாகவே பயன்படுத்துவதால் flex-flow எனும் சுருக்கெழுத்து property உருவாக்கப்பட்டது. இந்த சுருக்கெழுத்து property இரண்டு பண்புகளின் மதிப்புகளையும் ஒரு இடைவெளி விட்டு ஒன்று ஏற்றுக்கொள்கிறது.

                உதாரணத்திற்கு, flex-flow: row wrap பயன்படுத்தி rows மற்றும் wrap அமைக்கலாம்.

                flex-flow பயன்படுத்தி முன்னர் செய்த நிலையை மீண்டும் செய்யவும்.

                ', + 'te': '

                flex-direction మరియు flex-wrap అనే రెండు లక్షణాలు చాలా తరచుగా కలిసి ఉపయోగించబడతాయి, దీనివల్ల సంక్షిప్తలిపి ఆస్తి flex-flow వాటిని కలపడానికి సృష్టించబడింది. ఈ సంక్షిప్తలిపి ఆస్తి ఖాళీతో వేరు చేయబడిన రెండు లక్షణాల విలువను అంగీకరిస్తుంది.

                ఉదాహరణకు, మీరు అడ్డు వరుసలను సెట్ చేయడానికి మరియు వాటిని చుట్టడానికి flex-flow: row wrap ను ఉపయోగించవచ్చు.

                flex-flow మునుపటి స్థాయిని పునరావృతం చేయడానికి.

                ', + 'ml': '

                flex-direction and flex-wrap സ്ഥിരം ആയി ഉപയോഗിക്കുന്നതിനാൽ ഇവയെ ഒരുമിച്ചു flex-flow എന്ന് ചുരുക്കി ഉപയോഗിക്കാം. ഈ ഷോർട്ട് ഹാൻഡ് പ്രോപ്പർട്ടി ഒരു സ്പെയ്സ് കൊണ്ട് വേർതിരിച്ച രണ്ട് സവിശേഷതകളിൽ ഒന്ന് അംഗീകരിക്കുകയും ചെയ്യുന്നു.

                ഉദാഹരണംflex-flow: row wrap വരികൾ സജ്ജമാക്കുകയും അവ പൊതിയുക.

                മുൻപത്തെ നിലയിൽ ചെയ്തത് വീണ്ടും flex-flow ഉപയോഗിച്ച് ചെയുക

                ', + 'el': '

                Οι δύο ιδιότητες flex-direction και flex-wrap χρησιμοποιούνται τόσο συχνά μαζί ώστε η συντομογραφική ιδιότητα flex-flow δημιουργήθηκε για να τις συνδυάσει. Αυτή η συντομογραφική ιδιότητα αποδέχεται τις αξίες των δύο ιδιοτήτων χωριζόμενες από ένα διάστημα.

                Λόγου χάρη, μπορείτε να χρησιμοποιήστε το flex-flow: row wrap για να ορίσετε σειρές και να τις τυλίξετε.

                Δοκιμάστε να χρησιμοποιήσετε το flex-flow για να επαναλάβετε το προηγούμενο επίπεδο.

                ', + 'mk': '

                Двете својства flex-direction и flex-wrap се користат толку често заедно што е создадено својството flex-flow за да ги искомбинира. Ова скратено својство ја прима вредноста на едно од двете својства разделени со спејс.

                На пример, можете да користите flex-flow: row wrap да определите редови и да ги подредите.

                Пробајте да користите flex-flow да го повторите претходното ниво.

                ', + 'lv': '

                flex-direction un flex-wrap metodes tik ļoti bieži tiek lietotas kopā, ka tika izveidota saīsinātā metode, kas saucas flex-flow. Šī metode pieņem katras metodes vērtību atdalītu ar atstarpi.

                Piemēram, Tu vari lietot flex-flow: row wrap, lai uzstādītu rindas un novietotu elementus. Pamēģini pielietot flex-flow un vēlreiz iziet iepriekšējo līmeni.

                ', + 'id': '

                Dua properti flex-direction dan flex-wrap sering digunakan bersamaan shorthand properti flex-flow dibuat untuk menggabungkan keduanya. Shorthand properti ini menerima nilai dari satu dari dua properti terpisah oleh jarak/spasi.

                Sebagai contoh, kamu dapat menggunakanflex-flow: row wrap untuk mengatur kolom dan membungkusnya.

                Coba gunakan flex-flow untuk mengulangi tingkat sebelumnya.

                ', + 'ar': '

                الخاصيتان flex-direction و flex-wrap يتم استخدامهما معًا في كثير من الاحيان فتم انشاء خاصية flex-flow لدمجهما معًا. تقبل هذه الخاصية المختصرة قيمتين مفصولتين بمسافة.

                على سبيل المثال, يمكنك استخدام flex-flow: row wrap لضبط الصفوف (row) والتمدد (wrap).

                حاول استخدام flex-flow لاعادة حل المرحلة السابقة.

                ', + 'ca': '

                Les dos propietats flex-direction i flex-wrap s\'utilitzen sovint juntament amb la propietat abreujada flex-flow, que va ser creada para combinar-les. Aquesta propietat abreujada, accepta un valor de cada una separada per un espai.

                Per exemple, pots utilitzar flex-flow per establir filas i envoltar-les.

                Intenta utilitzar flex-flow per tornar a realitzar el nivell anterior.

                ', + 'da': '

                De to egenskaber flex-direction og flex-wrap bruges så ofte sammen at der findes en forkortelse flex-flow, som kombinerer de to. Denne forkortede egenskab tager imod værdier fra begge egenskaber med mellemrum imellem.

                For eksempel kan du bruge flex-flow: row wrap for at fordele elementer ud over flere rækker.

                Prøv at bruge flex-flow til at løse sidste niveau igen.

                ', + 'et': '

                Kaht omadust flex-direction ja flex-wrap kasutatakse tihti, seega loodi lühem omadus flex-flow, et need kokku panna. Sellele lühendatud omadusele saab anda väärtusi mõlemast omadusest kui need lahutada üksteisest tühikuga.

                Näiteks saad sa kasutada flex-flow: row wrap, et anda neile read ja pakkida nad ümber eraldi joonte.

                Proovi kasutada flex-flow, et läbida uuesti eelmine tase.

                ', + 'fi': '

                Ominaisuuksia flex-direction ja flex-wrap käytetään niin usein yhdessä, että niitä varten on luotu yhdistelmäominaisuus flex-flow. Tälle ominaisuudelle voi määrittää yhden kummankin ominaisuuden arvoista välilyönnillä erotettuna.

                Voit esimerkiksi määrittää vaakasuuntaisen järjestyksen ja jakaa sen useammalle riville kirjoittamalla flex-flow: row wrap.

                Kokeile ratkaista edellinen pulma flex-flow-ominaisuuden avulla.

                ', + 'gl': '

                As dúas propiedades flex-direction e flex-wrap úsanse xuntas tan a miúdo que se creou propiedade-atallo flex-flow para poder combinalas. Esta propiedade-atallo acepta o valor dunha ou das dúas propiedades separados por un espazo.

                Por exemplo, podes escribir flex-flow: row wrap para usar filas e distribuír os elementos entre elas.

                Proba a empregar flex-flow repetindo o nivel anterior.

                ', + 'th': '

                คุณสมบัติสองตัว flex-direction และ flex-wrap มักถูกใช้ด้วยกันบ่อยๆ จนคุณสมบัติย่อ flex-flow ถูกสร้างขึ้นเพื่อรวมมันเข้าด้วยกัน คุณสมบัติย่อนี้รับค่าของทั้งสองคุณสมบัติ โดยแยกด้วยช่องว่าง

                ตัวอย่างเช่น, คุณสามารถใช้ flex-flow: row wrap เพื่อกำหนดค่าแบบ row และ wrap

                ลองใช้คำสั่ง flex-flow ทำให้เหมือนเลเวลที่แล้ว

                ', + 'mn': '

                flex-direction болон flex-wrap гэх хоёр проперти маш олон удаа хамтдаа ашиглагддаг тул энэ хоёрийг нэгтгэн товчилсон пропертиflex-flow бүтээгдсэн байна. Энэхүү проперти нь нөгөө хоёр пропертийн хоосон зайгаар тусгаарлагдсан хоёр утгыг хүлээн авдаг.

                Жишээ нь, та flex-flow: row wrap-г ашиглан мөрүүдийг тохируулж болно.

                Өмнөх түвшинг давтахын тулд flex-flow ашиглана уу.

                ' + }, + board: 'gggggrrrrryyyyy', + style: { 'flex-flow': 'column wrap' }, + before: "#pond {\n display: flex;\n", + after: "}" + }, + { + name: 'align-content 1', + instructions: { + 'en': '

                The frogs are spread all over the pond, but the lilypads are bunched at the top. You can use align-content to set how multiple lines are spaced apart from each other. This property takes the following values:

                • flex-start: Lines are packed at the top of the container.
                • flex-end: Lines are packed at the bottom of the container.
                • center: Lines are packed at the vertical center of the container.
                • space-between: Lines display with equal spacing between them.
                • space-around: Lines display with equal spacing around them.
                • stretch: Lines are stretched to fit the container.

                This can be confusing, but align-content determines the spacing between lines, while align-items determines how the items as a whole are aligned within the container. When there is only one line, align-content has no effect.

                ', + 'he': '

                הצפרדעים מפוזרות בכל האגם, אבל העלים שלהן מתקבצים למעלה. אתם יכולים להשתמש ב-align-content כדי להגדיר איך שורות מרובות יתרווחו אחת מהשנייה. התכונה הזו מקבלת את הערכים הבאים:

                • flex-start: שורות נארזות בחלק העליון של הקונטיינר.
                • flex-end: שורות נארזות בחלק התחתון של הקונטיינר.
                • center: שורות נארזות באמצע הציר האנכי של הקונטיינר.
                • space-between: שורות מוצגות עם רווחים שווים בינהן.
                • space-around: שורות מוצגות עם רווחים שווים מסביבן.
                • stretch: שורות נמתחות כדי להתאים לגודל של הקונטיינר.

                זה יכול להיות מבלבל, אבל align-content משפיע על המרווחים שבין השורות, בעוד ש-align-items משפיעה על איך הפריטים כמכלול מיושרים בתוך הקונטיינר. כאשר יש רק שורה אחת, ל-align-content אין השפעה.

                ', + 'ro': '

                Broaștele sunt împrăștiate peste tot lacul, dar nuferii sunt înghesuiți în top. Poți să folosești align-content să setezi cum liniile multiple sunt spațiate una față de cealaltă. Această proprietate acceptă următoarele valori:

                • flex-start: Liniile sunt adunate în partea de sus a containerului.
                • flex-end: Liniile sunt adunate în partea de jos a containerului.
                • center: Liniile sunt adunate în centrul vertical al containerului.
                • space-between: Liniile sunt afișate cu spațiu egal între ele.
                • space-around: Liniile sunt afișate cu spațiu egal în jurul lor.
                • stretch: Liniile sunt întinse pentru a se potrivi in container.

                Acest lucru poate deruta, dar align-content determină spațiul dintre linii, în timp ce align-items determină cum elementele ca un grup sunt poziționate în înteriorul containerului. Când există doar o linie, align-content nu are niciun efect.

                ', + 'bg': '

                Жабчетата са разхвърляни из цялото езеро, но листата са скупчени в горната част. Можеш да използваш align-content да определиш как множесто редове се подреждат един до друг. Това свойство приема следните стойности:

                • flex-start: Редовете са разположени в горната част на контейнера.
                • flex-end: Редовете са разположени в долната част на контейнера.
                • center: Редовете са разположени във вертикалния център на контейнера.
                • space-between: Редовете са разположени с еднакво разстояние между тях.
                • space-around: Редовете са разположени с еднакво разстояние около тях.
                • stretch: Редовете са разпънати, за да се съберат в контейнера.

                Това може да бъде объркващо, но align-content определя разстоянието между редовете, докато align-items определя как елементите като цяло са разположени в контейнера. Когато има само един ред, align-content няма ефект.

                ', + 'de': '

                Die Frösche sind über den gesamten Teich verteilt, aber die Seerosenblätter befinden sich alle am oberen Ende. Du kannst align-content verwenden, um festzulegen, wie der Abstand zwischen mehreren Zeilen aussehen soll. Diese Eigenschaft akzeptiert die folgenden Werte:

                • flex-start: Zeilen oben im Container ausrichten.
                • flex-end: Zeilen unten im Container ausrichten.
                • center: Zeilen in der Mitte des Containers ausrichten.
                • space-between: Zeilen mit gleichmäßigem Innenabstand anordnen.
                • space-around: Zeilen mit gleichmäßigem Außenabstand anordnen.
                • stretch: Zeilen strecken, um den Container auszufüllen.

                Das kann etwas verwirrend sein, aber align-content beeinflusst den Abstand zwischen den Zeilen, wobei align-items festlegt, wie alle Elemente als Ganzes im Container angeordnet werden. Gibt es nur eine Zeile, so hat align-content keine Auswirkung.

                ', + 'pt-br': '

                Os sapos estão espalhados por toda a lagoa, mas as vitórias-régias estão agrupadas no topo. Você pode usar align-content para definir como múltiplas linhas devem ser espaçadas uma das outras. Essa propriedade recebe os seguintes valores:

                • flex-start: Linhas são agrupadas no topo do container.
                • flex-end: Linhas são agrupadas no fundo do container.
                • center:Linhas são agrupadas no centro vertical do container.
                • space-between: Linhas são posicionadas com espaço igual entre elas.
                • space-around: Linhas são posicionadas com espaço igual em torno delas.
                • stretch: Linhas se esticam para preencher o container.

                Isso pode ser confuso, mas align-content determina o espaçamento entre linhas, enquanto align-items determina como as linhas como um todo são alinhadas dentro do container. Quando há só uma linha, align-content não tem nenhum efeito.

                ', + 'es': '

                Las ranas están repartidas por todo el estanque, pero las hojas de lirio están agrupadas en la parte superior. Puedes usar align-content para establecer como múltiples líneas están separadas una de otra. Esta propiedad acepta los siguientes valores:

                • flex-start: Las líneas se posicionan en la parte superior del contenedor.
                • flex-end: Las líneas se posicionan en la parte inferior del contenedor.
                • center: Las líneas se posicionan en el centro (verticalmente hablando) del contenedor.
                • space-between: Las líneas se muestran con la misma distancia entre ellas.
                • space-around: Las líneas se muestran con la misma separación alrededor de ellas.
                • stretch: Las líneas se estiran para ajustarse al contenedor.

                Esto puede ser confuso, pero align-content determina el espacio entre las líneas, mientras que align-items determina como los elementos en su conjunto están alineados dentro del contenedor. Cuando hay solo una línea, align-content no tiene efecto.

                ', + 'fr': '

                Les grenouilles sont éparpillées partout dans l\'étang, mais les nénuphars sont amassés dans le haut. Vous pouvez utiliser align-content pour définir comment plusieurs lignes sont espacées de l\'une à l\'autre. Cette propriété prend les valeurs suivantes :

                • flex-start : Les lignes sont amassées dans le haut du conteneur.
                • flex-end: Les lignes sont amassées dans le bas du conteneur.
                • center : Les lignes sont amassées dans le centre vertical du conteneur.
                • space-between : Les lignes s\'affichent avec un espace égal entre eux.
                • space-around : Les lignes s\'affichent avec un espace égal autour d\'eux.
                • stretch : Les lignes sont étirées pour s\'adapter au conteneur.

                Ceci peut être déroutant, mais align-content détermine l\'espace entre les lignes, alors que align-items détermine comment les éléments dans leur ensemble sont alignées à l\'intérieur du conteneur. Quand il n\'y a qu\'une seule ligne, align-content n\'a aucun effet.

                ', + 'ru': '

                Лягушат раскидало по всему пруду, но лилии сгруппированы в верхней части. Ты можешь использовать align-content, чтобы указать, как несколько рядов должны отделяться друг от друга. Данное свойство принимает следующие значения:

                • flex-start: ряды группируются в верхней части контейнера.
                • flex-end: ряды группируются в нижней части контейнера.
                • center: ряды группируются вертикально по центру контейнера.
                • space-between: ряды отображаются с одинаковыми расстояниями между ними.
                • space-around: ряды отображаются с одинаковыми расстояниями вокруг них.
                • stretch: ряды растягиваются, чтобы заполнить контейнер равномерно.

                Это может запутать, но align-content отвечает за расстояние между рядами, в то время как align-items отвечает за то, как элементы в целом будут выровнены в контейнере. Когда только один ряд, align-content ни на что не влияет.

                ', + 'fa': '

                قورباغه ها در سراسر برکه پخش شده اند, اما نیلوفر های آبی در بالای برکه هستند. شما با استفاده از align-content آن ها را به صورت ردیفی به بالا هدایت کنید. این خاصیت مقادیر زیر را می پذیرد:

                • flex-start: با این مقدار flex-line ها در ابتدای flex-container جمع می‌شوند.
                • flex-end: با این مقدار flex-line ها در انتهای flex-container جمع می‌شوند.
                • center: با این مقدار flex-line ها در وسط flex-container جمع میشوند.
                • space-between: با این مقدار فضای خالی به طور مساوی بین flex line ها توزیع میشود. خط اول در ابتدا و خط آخر در انتهای flex container قرار می‌گیرند و بقیه خطوط در بین این ۲ خط قرار می‌گیرند.
                • space-around: فضای خالی به طور مساوی بین flex-line ها تقسیم می‌شود.
                • stretch: با این مقدار flex-line ها کشیده می‌شوند و فضای خالی را پر می کنند (این مقدار پیشفرض است).
                ', + 'zh-cn': '

                青蛙们在池塘里到处都是，然而荷叶都在顶部。你可以使用align-content来决定行与行之间隔多远。这个属性接受这些值：

                • flex-start: 多行都集中在顶部。
                • flex-end: 多行都集中在底部。
                • center: 多行居中。
                • space-between: 行与行之间保持相等距离。
                • space-around: 每行的周围保持相等距离。
                • stretch: 每一行都被拉伸以填满容器。

                这可能有些容易混淆，但align-content决定行之间的间隔，而align-items决定元素整体在容器的什么位置。只有一行的时候align-content没有任何效果。

                ', + 'zh-tw': '

                青蛙們在池塘裏到處都是，然而荷葉都在頂部。你可以使用align-content來決定行與行之間隔多遠。這個屬性接受這些值：

                • flex-start: 多行都集中在頂部。
                • flex-end: 多行都集中在底部。
                • center: 多行居中。
                • space-between: 行與行之間保持相等距離。
                • space-around: 每行的周圍保持相等距離。
                • stretch: 每一行都被拉伸以填滿容器。

                這可能有些容易混淆，但align-content決定行之間的間隔，而align-items決定元素整體在容器的什麼位置。只有一行的時候align-content沒有任何效果。

                ', + 'tr': '

                Kurbağalar göle dağılmışlar ama nilüfer yaprakları tepede toplanmışlar. align-content kuralı ile satırları birbirinden ayırabilirsiniz. Bu kural şu değerleri alır:

                • flex-start: Satırlar flex container\'ın tepesinde toplanır.
                • flex-end: Satırlar flex container\'ın aşağısında toplanır.
                • center: Satırlar flex container\'ın dikey ortasında toplanır.
                • space-between: Satırlar aralarında eşit boşluk kalacak şekilde yayılırlar.
                • space-around: Satırlar etraflarında eşit boşluk kalacak şekilde yayılırlar.
                • stretch: Satırlar flex container\'ı kaplamak için uzarlar.

                Bu kafa karıştırıcı olabilir, ama align-content satırlar için aralıkları belirlerken, align-items öğelerin flex container içerisinde beraberce nasıl hizalanacağını belirler. Eğer tek satır varsa, align-content kuralının bir etkisi yoktur.

                ', + 'az': '

                Qurbağalar gölə dağılıblar amma zanbaq yarpaqları təpədə toplanıblar. align-content qaydası ilə sətirləri birbirindən ayıra bilərsiniz. Bu qayda bu dəyərləri alır:

                • flex-start: Sətirlər flex container\'in təpəsində toplanır.
                • flex-end: Sətirlər flex container\'in aşağısında toplanır.
                • center: Sətirlər flex container\'in şaquli ortasında toplanır.
                • space-between: Sətirlər aralarında bərabər boşluq qalacaq şəkildə yayılırlar.
                • space-around: Sətirlər ətraflarında bərabər boşluq qalacaq şəkildə yayılırlar.
                • stretch: Sətirlər flex container\'i qaplamaq üçün uzanarlar.

                Bu çaşdırıcı olabilər, amma align-content sətirlər üçün aralıqları təyin edərkən, align-items elementlərin flex container içində bərbaər şəkildə necə nizamlanacağını təyin edər. Əgər tək sətir varsa, align-content qaydasının bir təsiri yoxdur.

                ', + 'it': '

                Le rane sono sparse per tutto il lago mentre le ninfee sono tutte raggruppate in alto. Puoi utilizzare align-content per decidere come le linee verranno distanziate tra di loro. Questa proprietà accetta i seguenti valori:

                • flex-start: Le linee sono raggruppate all\'inizio del contenitore.
                • flex-end: Le linee sono raggruppate alla fine del contenitore.
                • center: Le linee vengono centrate verticalmente nel contenitore.
                • space-between: Le linee occupano tutto lo spazio del contenitore e sono separate tra di loro dalla stessa quantità di spazio.
                • space-around: Le linee sono separate dalle altre linee, e dall\'inizio e dalla fine del contenitore dalla stessa quantità di spazio.
                • stretch: Le linee vengono allungate per occupare tutto lo spazio disponibile.

                Questo potrebbe creare confusione, ma align-content determina lo spazio tra le linee mentre align-items determina come gli elementi nell\'insieme vengono disposti nel contenitore. Se c\'è una sola linea, align-content non ha alcun effetto.

                ', + 'ko': '

                개구리들이 연못의 사방에 퍼져있고, 수련잎은 연못의 위쪽에 모여있습니다. align-content를 사용하여 여러 줄 사이의 간격을 지정할 수 있습니다. 이 속성은 다음의 값들을 인자로 받습니다:

                • flex-start: 여러 줄들을 컨테이너의 꼭대기에 정렬합니다.
                • flex-end: 여러 줄들을 컨테이너의 바닥에 정렬합니다.
                • center: 여러 줄들을 세로선 상의 가운데에 정렬합니다.
                • space-between: 여러 줄들 사이에 동일한 간격을 둡니다.
                • space-around: 여러 줄들 주위에 동일한 간격을 둡니다.
                • stretch: 여러 줄들을 컨테이너에 맞도록 늘립니다.

                이 속성을 사용하는 방법이 어려울 수 있습니다. align-content는 여러 줄들 사이의 간격을 지정하며, align-items는 컨테이너 안에서 어떻게 모든 요소들이 정렬하는지를 지정합니다. 한 줄만 있는 경우, align-content는 효과를 보이지 않습니다.

                ', + 'lt': '

                Varlytės pasiskirsčiusios po visą tvenkinį, bet lelijų lapai plūduriuoja tvenkinio viršuje. Galite nauoti align-content, kad nustatytumėte kokiais tarpais viena nuo kitos bus atskirtos kelios eilutės. Ši komanda reaguoja į šias vertes:

                • flex-start: Eilutės yra susitelkusios viršuje.
                • flex-end: Eilutės yra susitelkusios apačioje.
                • center: Eilutės yra vertikaliai susitelkusios viduryje.
                • space-between: Eilutės yra paskirstomos taip, kad tarpai tarp jų būtų vienodi.
                • space-around: Eilutės paskirstomos taip, kad tarpai aplink jas būtų vienodi.
                • stretch: Eilutės yra ištempiamos, kad užpildytų supantį elementą.

                Tai gali būti painoka, bet align-content nustato tarpus tarp eilučių, o tuo tarpu align-items nustato kaip elementai kaip visuma yra lygiuojami juos supančiame elemente. Kai atvaizduojama tik viena eilutė, align-content neturi jokio poveikio.

                ', + 'vi': '

                Những chú ếch đang lan rộng trên cả ao, nhưng các lá bông súng đang chụm lại ở phía trên. Bạn có thể dùng align-content để thiết lập cách các dòng có khoảng cách xa nhau như thế nào. Những thuộc tính này có giá trị như sau:

                • flex-start: Các dòng được dồn về phía trên cùng của hộp chứa.
                • flex-end: Các dòng được dồn về phía dưới cùng của hộp chứa.
                • center: Các dòng được dồn về trung tâm của hộp chứa.
                • space-between: Các dòng được trình bày với khoảng cách bằng nhau giữa chúng.
                • space-around: Các dòng sẽ được trình bày với khoảng cách bằng nhau xung quanh chúng.
                • stretch: Các dòng sẽ được kéo dài để phù hợp với hộp chứa.

                Điều này có thể gây nhầm lẫn, nhưng align-content xác định khoảng cách giữa các dòng, trong khi align-items xác định cách các hạng mục như một toàn thể được xếp trong hộp chứa. Khi chỉ có một dòng, align-content không có hiệu lực.

                ', + 'pl': '

                Żabki rozproszyły się po całym stawie ale listki upchnęły się u góry. Własność align-content pomoże ci ustalić odległość wierszy kontenera od siebie. Własność ta przyjmuje takie wartości:

                • flex-start: Wiersze upychają u góry kontenera.
                • flex-end: Wiersze upychają się w dolnej części kontenera.
                • center: Wiersze upychane są pośrodku kontenera.
                • space-between: Wiersze wyświetlane są z równymi odstępami.
                • space-around: Wiersze wyświetlane są z równymi odstępami dookoła.
                • stretch: Wiersze rozszerzają się tak, aby dopasować się do kontenera.

                Może to być trochę pogmatwane ale align-content określa odstępy między wierszami podczas, gdy align-items określa jak elementy, jako całość, wyrównują się względem kontenera. W przypadku, gdy jest tylko jedna linia, align-content nie przynosi żadnego efektu.

                ', + 'cs': '

                Žabky se rozprostřely přes celý rybník, ale lekníny jsou všechny nahoře. K nastavení rozmístění řádků v kontejneru slouží align-content. Tato vlastnost má následující hodnoty:

                • flex-start: Hromadí řádky na horní straně kontejneru.
                • flex-end: Hromadí řádky na spodní straně kontejneru.
                • center: Hromadí řádky na svislém středu kontejneru.
                • space-between: Rozmístí rovnoměrné mezery mezi řádky.
                • space-around: Rozmístí rovnoměrné mezery kolem řádků.
                • stretch: Roztáhne řádky, aby vyplnily kontejner.

                Může to být trochu matoucí, ale align-content určuje mezery mezi řádky, zatímco align-items určuje, jak jsou prvky jako celek zarovnány v kontejneru. Pokud je v kontejneru jen jeden řádek, align-content se neuplatní.

                ', + 'ja': '

                カエルたちが池いっぱいに広がっていますが、蓮の葉は上方に集まっています。複数の行が他の行とどう距離を取り広がるのかを指定するのに、align-contentを使うことができます。このプロパティーは以下の値を取ります。

                • flex-start: 行はコンテナーの上側に詰められます。
                • flex-end: 行はコンテナーの下側に詰められます。
                • center: 行はコンテナーの中央に詰められます。
                • space-between: 行はその間に等しい間隔を空けて表示されます。
                • space-around: 行はその周囲に等しい間隔を空けて表示されます。
                • stretch: 行はコンテナーに合うよう引き延ばされます。

                混乱したかもしれませんが、align-contentは行間の余白を決めるもので、align-itemsはコンテナーに含まれるアイテム全体としての配置を決めるものです。一行だけの場合はalign-contentは何も効果がありません。

                ', + 'hu': '

                A békák szétszóródtak mindenfelé a tavon, míg a tündérrózsák a tó tetején gyülekeznek. Az align-content használatával beállíthatod, hogy több sor esetén a sorok milyen távolságokra legyenek egymástól. Ez a tulajdonság a következő értékeket veheti fel:

                • flex-start: A sorok a konténer tetejére rendeződnek.
                • flex-end: A sorok a konténer aljához rendeződnek.
                • center: A sorok a konténeren belül függőlegesen középre rendeződnek.
                • space-between: A sorok közötti tér kiegyenlítetten oszlik el.
                • space-around: A sorok körülötti tér egyenlően oszlik el.
                • stretch: A sorok széthúzódnak, hogy kitöltsék a konténerüket.

                Talán kicsit megtévesztő, de az align-content a sorok közötti teret befolyásolja, míg az align-items meghatározza hogy az elemek összessége miképp igazodjon a konténeren belül. Amennyiben csak egyetlen sor van, az align-content nem fejt ki semmilyen hatást.

                ', + 'eo': '

                La ranoj disvastigas ĉien en la lageto, tamen la akvolilifolioj supren amasiĝas. Vi povas uzi align-content por precizigi kiel multoblaj linioj malproksimigatas unuajn la aliajn. Ĉi tiu trajto prenas la sekvajn valorojn:

                • flex-start: Linioj aranĝiĝas supren de la ujo.
                • flex-end: Linioj aranĝiĝas malsupren de la ujo.
                • center: Linioj aranĝiĝas al la vertikala centro de la ujo.
                • space-between: Linioj afiŝas kun samaspacoj inter ili.
                • space-around: Linioj afiŝas kun samaspacoj ĉirkaŭ ili.
                • stretch: Linioj sterniĝas por ke ili laŭmezure taŭgu la ujon.

                Tiu ago povas esti konfuziganta, sed align-content determinas la spacojn inter linioj, dum align-items determinas kiel la tutaj elementoj kune liniiĝas interne de la ujo. Kiam estas nur unu linio, align-content nenion farus.

                ', + 'sv': '

                Grodorna är helt utspridda över dammen men blombladen är samlade i toppen. Man kan använda align-content för att sätta hur multipla rader placeras i förhållande till varandra. Detta attribut accepterar följande värden:

                • flex-start: Rader placeras i toppen av containern.
                • flex-end: Rader placeras i bottena av containern.
                • center: Rader placeras vertikalt i mitten av containern.
                • space-between: Raderna får jämn fördelning av utrymmet mellan dem.
                • space-around: Raderna får jämn fördelning av utrymmet runt dem.
                • stretch: Raderna sträcks ut för att fylla containern.

                Detta kan vara förvirrande, men align-content definierar utrymmet mellan raderna medan align-items definerar hur objekt i sin helhet är placerade i själva containern. När det bara finns en rad har align-content ingen effekt.

                ', + 'uk': '

                Жабенята розповзлися по всьому ставку, а листя латаття знаходиться вгорі. Маєш скористатися властивістю align-content, щоб вказати як декілька рядків мають бути розташовані один до одного. Властивість набуває таких значень:

                • flex-start: Рядки буде розташовано вгорі контейнеру.
                • flex-end: Рядки буде розташовано внизу контейнеру.
                • center: Рядки групуються вертикально по центру контейнеру.
                • space-between: Рядки розташовуються з однаковими проміжками навколо них.
                • space-around: Рядки розташовуються з однаковими проміжками між ними.
                • stretch: Рядки розтягуються заповнюючи контейнер рівномірно.

                Це може збивати з пантелику, але align-content визначає інтервал поміж рядками, в той час як align-items визначає, як елементи буде вирівняно в контейнері в цілому. Коли у вас лише один рядок, align-content не має ніякого ефекту.

                ', + 'hi': '

                मेंढक पूरे तालाब के उपर फैले हुए हैं, परन्तु लिली के पत्ते तालाब के उपर की तरफ हैं। आप align-content की मदद से पंक्तियों के मध्य के अंतर को निश्चित कर सकते हैं। यह प्रॉपर्टी निम्न मान स्वीकार करती है:

                • flex-start: पंक्तियों को कंटेनर के शीर्ष में रखा जाता है।
                • flex-end: पन्तियों को कंटेनर के अंत में रखा जाता है।
                • center: पंक्तियों को कंटेनर के उर्ध्वाधर केंद्र में रखा जाता है।
                • space-between: पंक्तियों के मध्य बराबर दूरी रखी जाती है।
                • space-around: पंक्तियों के चारों ओर दूरी बराबर रखी जाती है।
                • stretch: पंक्तियों को खीच कर कंटेनर के बराबर किया जाता है।

                यह भ्रामक प्रतीत होता है, परन्तु align-content पंक्तियों के अंतर को दर्शाता है जबकि align-items बताता है की किस तरह कोई वस्तु कंटेनर में संरेखित है। जब केवल एक ही पंक्ति मोजूद हो तो align-content का कोई प्रभाव नहीं होगा।

                ', + 'sr': '

                Жабице су раштркане по барици, док су локвањи груписани у врху. Можеш да користиш align-content да дефинишеш како су редови размакнути. Ово својство прихвата следеће вредности:

                • flex-start: Редови су груписани у горњем делу контејнера.
                • flex-end: Редови су груписани у доњем делу котејнера.
                • center: Редови су груписани у вертикалном центру контејнера.
                • space-between: Редови су приказани са идентичним растојањем између редова.
                • space-around: Редови су приказани са идентичним растојањем около редова.
                • stretch: Редови су развучени да попуне контејнер.

                Можда збуњује али align-content дефинише размак између редова, док align-items дефинише како су елементи као целина (група) поравњати у контејнеру. Када постоји само један ред align-content нема ефекта.

                ', + 'bs': '

                Žabice su raštrkane po barici, dok su listovi grupisani u vrhu. Možeš da koristiš align-content da definišeš kako su redovi razmaknuti. Ovo svojstvo prihvata sljedeće vrijednosti:

                • flex-start: Redovi su grupisani u gornjem dijelu kontejnera.
                • flex-end: Redovi su grupisani u donjem dijelu kotejnera.
                • center: Redovi su grupisani u vertikalnom centru kontejnera.
                • space-between: Redovi su prikazani sa identičnim rastojanjem između redova.
                • space-around: Redovi su prikazani sa identičnim rastojanjem okolo redova.
                • stretch: Redovi su razvučeni da popune kontejner.

                Možda zbunjuje ali align-content definiše razmak između redova, dok align-items definiše kako su elementi kao celina (grupa) poravnjati u kontejneru. Kada postoji samo jedan red align-content nema efekta.

                ', + 'hr': '

                Žabice su raštrkane po barici, dok su listovi grupirani u vrhu. Možeš koristiti align-content da definiraš kako su redovi razmaknuti. Ovo svojstvo prihvaća sljedeće vrijednosti:

                • flex-start: Redovi su grupirani u gornjem dijelu kontejnera.
                • flex-end: Redovi su grupirani u donjem dijelu kotejnera.
                • center: Redovi su grupirani u vertikalnom centru kontejnera.
                • space-between: Redovi su prikazani sa identičnim razmakomm između redova.
                • space-around: Redovi su prikazani sa identičnim razmakom okolo redova.
                • stretch: Redovi su razvučeni da popune kontejner.

                Možda zbunjuje ali align-content definira razmak između redova, dok align-items definira kako su elementi kao cjelina (grupa) poravnati u kontejneru. Kada postoji samo jedan red align-content nema efekta.

                ', + 'nl': '

                De kikkers zijn over heel de vijver verspreidt, maar de lelieblaadjes zijn bovenaan gegroepeerd. Je kunt align-content gebruiken om te bepalen hoe de spatiëring tussen meerdere lijnen gebeurd. Deze eigenschap aanvaard de volgende waarden:

                • flex-start: Lijnen worden aan de bovenzijde van de container verpakt.
                • flex-end: Lijnen worden aan de onderzijde van de container verpakt.
                • center: Lijnen worden op het verticale center van de container verpakt.
                • space-between: Lijnen worden gedistribueerd over de volledige dimensie en krijgen een gelijke spatiëring tussen elke lijn.
                • space-around: Lijnen worden gedistribueerd over de volledige dimensie en krijgen een gelijke spatiëring rond elke lijn.
                • stretch: Lijnen worden uitgerokken om in de container te passen.

                Dit kan verwarrend overkomen, maar align-content bepaald de spatiëring tussen lijnen, terwijl align-items de opstelling van alle items binnen de container bepaald. Als er slechts een lijn is, heeft align-content geen effect.

                ', + 'ta': '

                தவளைகள் குளத்தின் அனைத்து பகுதிகளிலும் சிதறியுள்ளன. ஆனால், இலைகள் ஒன்றாக மேற்புறம் ஒதுங்கியுள்ளன. align-content பயன்படுத்தி பல வரிகளுக்கு இடையேயுள்ள இடைவெளியை கட்டுப்படுத்தலாம். இந்த property பின்வரும் மதிப்புகளை ஏற்றுக்கொள்கிறது:

                • flex-start: Lines மேற்புறமாக சீரமைக்கப்படும்.
                • flex-end: Lines கீழ்புறமாக சீரமைக்கப்படும்.
                • center: Lines செங்குத்து மத்தியத்தில் சீரமைக்கப்படும்.
                • space-between: Lines இடைவெளியில் சமமான இடைவெளி விடப்படும்.
                • space-around: Lines சுற்றி சமமான இடைவெளி விடப்படும்.
                • stretch: Lines, container-ல் பொருந்தும் வண்ணம் நீட்டி சீரமைக்கப்படும்.

                இதில் ஒருவித குழப்பம் இருக்கலாம், align-content வரிகளுக்கு இடையேயுள்ள இடைவெளியை மட்டுமே கட்டுப்படுத்துகிறது. ஒரே ஒரு வரி மட்டும் இருக்கும் பொது align-content வேலை செய்யாது.

                ', + 'te': '

                కప్పలు చెరువు అంతా విస్తరించి ఉన్నాయి, కాని లిల్లీప్యాడ్‌లు పైభాగంలో ఉండిపోయాయి. మీరు

              • space-between వాడి వేరు వేరు వరుసల మద్యలో ఎంత కాళీ ఉండాలో చెప్పచు ఈ ఆస్తి ఈ క్రింది విలువలను తీసుకుంటుంది:

                • flex-start: కంటైనర్ పైభాగంలో లైన్స్ ప్యాక్ చేయబడతాయి.
                • flex-end: కంటైనర్ దిగువన లైన్స్ ప్యాక్ చేయబడతాయి.
                • center: కంటైనర్ యొక్క నిలువు మధ్యలో లైన్స్ ప్యాక్ చేయబడతాయి.
                • space-between వాటి మధ్య.
                • space-around: లైన్స్ వాటి చుట్టూ సమాన అంతరాలతో ప్రదర్శించబడతాయి. కంటైనర్.

                ఇది గందరగోళంగా ఉంటుంది, కానీ align-content పంక్తుల మధ్య అంతరాన్ని నిర్ణయిస్తుంది, అయితే align-items ఎలా నిర్ణయిస్తుంది మొత్తం అంశాలు కంటైనర్‌లో సమలేఖనం చేయబడతాయి. ఒకే ఒక పంక్తి ఉన్నప్పుడు, align-content ప్రభావం ఉండదు. ', + 'ml': '

                തവളകൾ മുഴുവൻ കുളങ്ങളിൽ പടർന്നു കിടക്കുന്നു, എന്നാൽ ലില്ലിപാഡുകൾ മുകളിലത്തെ നിലയിൽ വളരുന്നു. align-content ഉപയോഗിച്ച് ഓരോ നിരയെയും നീക്കി നിർത്താൻ സാധിക്കും. ഈ പ്രോപ്പർട്ടി ഇനിപ്പറയുന്ന മൂല്യങ്ങൾ സ്വീകരിക്കുന്നു:

                • flex-start: ലൈനുകൾ കണ്ടെയ്നർ മുകളിൽ കയറുന്നു.
                • flex-end: പാറ്റേണുകളുടെ അടിയിൽ വരികൾ പായ്ക്ക് ചെയ്യപ്പെടുന്നു.
                • center: ലൈനുകളുടെ ലംബമായ കേന്ദ്രത്തിൽ ലൈനുകൾ പൂരിപ്പിച്ചിരിക്കുന്നു.
                • space-between: അവയ്ക്കിടയിൽ തുല്യ ഇടവേളകളോടെയാണ് രേഖകൾ കാണിക്കുന്നത്.
                • space-around: ലൈനുകൾ അവയ്ക്ക് തുല്യമായ ഇടവേളകളിൽ കാണിക്കുന്നു.
                • stretch: കണ്ടെയ്നറുകൾക്ക് അനുയോജ്യമാക്കാൻ ലൈനുകൾ വലിച്ചു.

                ഇത് ആശയക്കുഴപ്പത്തിലാക്കും, പക്ഷേ align-content വരികൾക്കിടയിൽ സ്പെയ്സിംഗ് നിശ്ചയിക്കുന്നു, align-items കണ്ടെയ്നറിൽ മുഴുവൻ ഇനങ്ങൾ എങ്ങനെ വിന്യസിക്കപ്പെട്ടിരിക്കുന്നു എന്ന് നിർണ്ണയിക്കുന്നു. ഒരു വഴി ഉള്ളപ്പോൾ , align-content എഫ്ഫക്റ്റ് ഉണ്ടാകില്ല.

                ', + 'el': '

                Οι βάτραχοι είναι διεσπαρμένοι σ\' όλη την επιφάνεια της λιμνούλας, αλλά τα νούφαρα είναι μαζεμένα στο πάνω μέρος. Μπορείτε να χρησιμοποιήσετε το align-content για να ορίσετε πως πολλαπλές γραμμές χωρίζονται με διάστημα η μία από την άλλη. Αυτή η ιδιότητα παίρνει τις εξής αξίες:

                • flex-start: Οι γραμμές τοποθετούνται στο πάνω μέρος του container.
                • flex-end: Οι γραμμές τοποθετούνται στο κάτω μέρος του container.
                • center: Οι γραμμές τοποθετούνται στο κάθετο κέντρο του container.
                • space-between: Οι γραμμές εμφανίζονται με ίσο διάστημα μεταξύ τους.
                • space-around: Οι γραμμές εμφανίζονται με ίσο διάστημα γύρω τους.
                • stretch: Οι γραμμές τεντώνονται για να ταιριάξουν στο container.

                Αυτό μπορεί να είναι συγχυστικό, αλλά το align-content καθορίζει το διάστημα μεταξύ γραμμών, ενώ το align-items καθορίζει πως τα αντικείμενα ως σύνολο ευθυγραμμίζονται μέσα στο container. Όταν υπάρχει μόνο μία γραμμή, το align-content δεν έχει επίδραση.

                ', + 'mk': '

                Жабите се распределени низ целото езерце, но листовите се во купче на горниот крај. Можете да користите align-content да поставите како множество на редови се разделени помеѓу себе. Ова својство ги прима следните вредности:

                • flex-start: Редовите се собрани на горниот крај од контејнерот.
                • flex-end: Редовите се собрани на долниот крај од контејнерот.
                • center: Редовите се собрани на вертикалниот центар на контејнерот.
                • space-between: Редовите се појавуваат со еднакво растојание помеѓу себе.
                • space-around: Редовите се појавуваат со еднакво растојаните околу себе.
                • stretch: Редовите се истегнати да го пополнат контејнерот.

                Ова може да биде збунувачки, но align-content го определува растојанието помеѓу редови, додека align-items определува како сите елементи заедно се подредени во контејнерот. Кога има само еден ред, align-content нема ефект.

                ', + 'lv': '

                Vardulēni ir izvietojušies pa visu dīķi, bet ūdensrozes stāv augšpusē. Lai organizētu atstarpes starp vairākām rindām, Tu vari pielietot align-content metodi. Šī metode pieņem sekojošas vērtības :

                • flex-start: Rindas ir iespiestas konteinera augšpusē.
                • flex-end: Rindas ir iespiestas konteinera apakšpusē.
                • center: Rindas ir iespiestas konteinera vertikālajā centrā.
                • space-between: Rindas tiek novietotas ar vienādu atstarpi starp tām.
                • space-around: Rindas tiek novietotas ar vienādu apkārtesošo laukumu.
                • stretch: Rindas tiek izstieptas pa visu konteineru.

                Šis var radītu apjukumu, bet align-content nosaka atstarpi starp rindām, kamēr align-items nosaka kā elementi ir izvietoti attiecībā pret konteineru. Gadījumos, kad ir tikai viena rinda, align-content nedarbojas.

                ', + 'id': '

                PAra katak tersebar di seluruh kolam, tetap ada beberapa lilypads diatas. Kamu dapat gunakan align-content untuk mengatur beberapa baris untuk memberi jarak dari masing-masing. Properti ini memiliki nilai:

                • flex-start: Baris ini mengumpulkan pada wadah bagian atas.
                • flex-end: Baris dikemas di bagian bawah wadah.
                • center: Baris dikemas di pusat vertikal wadah.
                • space-between: Baris ditampilkan dengan jarak sesuai diantara mereka.
                • space-around: baris ditampilkan dengan jarak yang sama diantara mereka.
                • stretch: Baris di tarik untuk menyesuaikan jarak wadah.

                Ini mungkin membinggungkan, tapi align-content menentukan jarak diantara baris, sedangkan align-items menentukan bagaimana objek secara keseluruhan sejajar di dalam wadah. Ketika ada satu baris, align-content hal ini tidak akan memberikan effect apapun.

                ', + 'ar': '

                تنتشر الضفادع في جميع انحاء البركة, لكن اوراق الزنبق محشورة في الاعلى. يمكنك استخدام align-content لضبط كيفية تباعد الاسطر المتعددة عن بعضها البعض. هذه الخاصية تقبل القيم التالية:

                • flex-start: تعبئة الخطوط في الجزء العلوي من الحاوية.
                • flex-end: تعبئة الخطوط في الجزء السفلي من الحاوية.
                • center: تعبئة الخطوط في الجزء الاوسط من الحاوية عاموديا.
                • space-between: تعبئة الخطوط مع مسافات متساوية بينهم.
                • space-around: تعبئة الخطوط مع مسافات متساوية حولهم.
                • stretch: تمدد العناصر عاموديا لتملئ الحاوية.

                يمكن ان يكون هذا مربكًا, لكن align-content تحدد المسافة بين الخطوط, بينما align-items تحدد كيفية محاذاة العناصر ككل داخل الحاوية. عندما يكون هناك سطر واحد فقط, align-content لا تحدث اي تأثير.

                ', + 'ca': '

                Les granotes estan repartides per tot l\'estany, però els nenúfars estan agrupats en la part superior. Pots utilitzar align-content per establir-ho com múltiples línies que estan separades unes de les altres. Aquesta propietat accepta els següents valors:

                • flex-start: Les línies es posicionen en la part superior del contenidor.
                • flex-end: Les línies es posicionen en la part inferior del contenidor.
                • center: Les línies es posicionen en el mig (verticalment) del contenidor.
                • space-between: Les línies es mostren amb la mateixa distància entre elles.
                • space-around: Les línies es mostren amb la mateixa separació al voltant d\'elles.
                • stretch: Les línies s\'estiren per ajustar-se al contenidor.

                Això pot confondre, però align-content determina l\'espai entre les línies, mentre que align-items determina com els elements conjuntament estan alineats dins del contenidor. Quan hi ha només una línia, align-content no té cap efect.

                ', + 'da': '

                Frøerne er spredt ud over hele dammen, men alle åkanderne er i toppen. Du kan bruge align-content til at fastlægge hvor langt der skal være mellem linjer. Denne egenskab tager følgende værdier:

                • flex-start: Linjerne stuves sammen i toppen af beholderen.
                • flex-end: Linjerne stuves sammen i bunden af beholderen.
                • center: Linjerne stuves sammen i midten af beholderen.
                • space-between: Linjerne vises med fast afstand imellem sig.
                • space-around: Linjerne vises med fast afstand omkring sig.
                • stretch: Linjerne strækkes så de passer til beholderen.

                Det kan være en smule forvirrende, men align-content bestemmer afstanden mellem linjer, mens align-items bestemmer hvordan elementerne som helhed er placeret i beholderen. Når der kun er en enkelt linje gør align-content ingenting.

                ', + 'et': '

                Konnad on laiali üle tiigi, aga kõik vesiroosilehed on tiigi ülaosas. Sa saad kasutada omadust align-content, et muuta seda, kui kaugel jooned üksteisest on. Sellele omadusele saab anda järgmisi väärtusi:

                • flex-start: Jooned on pakitud konteineri tippu.
                • flex-end: Jooned on pakitud konteineri põhja.
                • center: Jooned on pakitud vertikaalselt konteineri keskele.
                • space-between: Kõigi joonte vahel on sama suur vahe.
                • space-around: Kõigi joonte ümber on sama palju ruumi.
                • stretch: Jooned on venitatud nii, et mahuvad konteineri sisse.

                See võib tunduda väga keeruline, aga lühidalt align-content määrab kui palju ruumi on joonte vahel ning align-items määrab kuidas elemendid ise on paigutatud konteineri sees. Kui jooni on ainult 1, siis align-content ei tee mitte midagi.

                ', + 'fi': '

                Sammakot ovat levittäytyneet joka puolelle lampea, mutta lumpeenlehdet ovat kerääntyneet yläreunaan. Voit määrittää usean rivin asettelun align-content-ominaisuuden avulla. Ominaisuudelle voi antaa jonkin seuraavista arvoista:

                • flex-start: Rivit pakkautuvat säilön yläreunaan.
                • flex-end: Rivit pakkautuvat säilön alareunaan.
                • center: Rivit pakkautuvat pystysuuntaisesti säilön keskelle.
                • space-between: Rivien välissä on yhtä paljon tilaa.
                • space-around: Rivien ympärillä on yhtä paljon tilaa.
                • stretch: Rivit venytetään säilön koon mukaan.

                Tämä saattaa vaikuttaa monimutkaiselta, mutta align-content määrittää rivien välisen tilan ja align-items määrittää, kuinka elementit kokonaisuudessaan kohdistetaan säilön sisällä. Jos rivejä on vain yksi, ominaisuudella align-content ei ole vaikutusta.

                ', + 'gl': '

                As rás están espalladas por toda a poza, pero os nenúfares amoréanse na parte superior. Podes usar align-content para establecer como se separan as múltiples liñas unhas das outras. Esta propiedade acepta os seguintes valores:

                • flex-start: As liñas xúntanse na parte superior do contedor.
                • flex-end: As líñas xúntanse na parte inferior do contedor.
                • center: As liñas xúntanse no centro vertical do contedor.
                • space-between: As liñas distribúense co mesmo espazo entre elas.
                • space-around: As líñanse distribúense co mesmo espazo darredor delas.
                • stretch: As liñas estíranse para axustarse ao contedor.

                Isto pode resultar confuso, pero align-content determina o espazo entre as liñas, mentres que align-items determina o xeito no que os elementos como conxunto se aliñan dentro do contedor. Cando só hai unha liña, align-content non ten ningún efecto.

                ', + 'th': '

                เจ้ากบกระจายอยู่ทั่วทั้งสระน้ำ, แต่ใบบัวกระจุกกันอยู่ด้านบน คุณสามารถใช้ align-content เพื่อตั้งค่าการจัดบรรทัด ว่าจะจัดให้แยกกันอย่างไร คุณสมบัตินี้รับค่าดังต่อไปนี้:

                • flex-start: บรรทัดจะถูกห่อรวมกันไว้ด้านบนของ container
                • flex-end: บรรทัดจะถูกห่อรวมกันไว้ด้านล่างของ container
                • center: บรรทัดจะถูกห่อรวมกันไว้ตรงกลางในแนวตั้งของ container
                • space-between: แสดงบรรทัดให้มีช่องว่างระหว่างกันเท่าๆกัน
                • space-around: แสดงบรรทัดให้มีช่องว่างรอบๆบรรทัดเท่ากัน
                • stretch: ดึงบรรทัดให้พอดีกับ container

                มันอาจจะดูงงๆหน่อย, แต่คำสั่ง align-content กำหนดปริมาณช่องว่างระหว่างบรรทัด, ในขณะที่ align-items กำหนดว่า items ทั้งหมดจะถูกเรียง container อย่างไร ในกรณีที่มีแค่บรรทัดเดียว, align-content จะไม่มีผลใดๆ

                ', + 'mn': '

                Мэлхийнүүд цөөрмийн бүх хэсэгт тархсан боловч сараана цэцэгс контейнерийн дээд талд бөөгнөрсөн байна. Та align-content-г ашиглан олон мөрүүд бие биенээсээ ямар зайтай байрлахыг тохируулж болно. Энэ проперти нь дараах утгуудыг авна:

                • flex-start: Мөрүүдийг контейнерын дээд талд байрлуулах.
                • flex-end: Мөрүүдийг контейнерын ёроолд байрлуулах.
                • center: Мөрүүдийг контейнерын босоо төвд байрлуулах.
                • space-between: Мөрүүдийг хоорондоо ижил зайтай байхаар байрлуулах.
                • space-around: Мөрүүдийн эргэн тойрон нь ижил зайтай байхаар байрлуулах.
                • stretch: Контейнерт тохируулан мөрүүдийг сунган байрлуулах.

                Ойлгомжгүй байж магадгүй ч align-content нь мөрүүдийн хоорондын зайг тодорхойлдог. Харин align-items нь бүх items контейнертэйгээ харьцангуй хэрхэн байрлахыг тодорхойлдог. Зөвхөн нэг мөр байвал align-content ямар ч нөлөө үзүүлэхгүй.

                ' + }, + board: 'ggggggggggggggg', + classes: { '#pond, #background': 'wrap' }, + style: { 'align-content': 'flex-start' }, + before: "#pond {\n display: flex;\n flex-wrap: wrap;\n", + after: "}" + }, + { + name: 'align-content 2', + instructions: { + 'en': '

                Now the current has bunched the lilypads at the bottom. Use align-content to guide the frogs there.

                ', + 'he': '

                עכשיו הזרם פיזר את העלים בתחתית האגם. השתמשו ב-align-content כדי לעזור לצפרדעים להגיע לשם.

                ', + 'ro': '

                Acum curentul a înghesuit nuferii în partea de jos. Folosește align-content pentru a ghida broaștele acolo.

                ', + 'bg': '

                Сега вятърът е скупчил листата в долната част. Използвай align-content да насочиш жабчетата натам.

                ', + 'de': '

                Der Strom hat die Seerosenblätter nach unten getrieben. Benutze align-content, um die Frösche dorthin zu führen.

                ', + 'pt-br': '

                Agora a correnteza agrupou as vitórias-régias no fundo. Use align-content para guiar os sapos até lá.

                ', + 'es': '

                Ahora, la corriente ha agrupado las hojas de lirio en la parte inferior. Usa align-content para guiar las ranas hasta allí.

                ', + 'fr': '

                Maintenant, le courant a amassé tous les nénuphars dans le bas de l\'étang. Utilisez align-content pour guider les grenouilles vers le bas.

                ', + 'ru': '

                Теперь течение сгруппировало лилии в нижней части. Используй align-content, чтобы направить лягушат туда.

                ', + 'fa': '

                در حال حاضر نیلوفر های آبی به پایین برکه حرکت کرده اند. با استفاده از align-content قورباغه ها را هدایت کنید.

                ', + 'zh-cn': '

                现在水流把荷叶都推到底部了。用align-content来指引青蛙到那里。

                ', + 'zh-tw': '

                現在水流把荷葉都推到底部了。用align-content來指引青蛙到那裏。

                ', + 'tr': '

                Bu gölde nilüfer yaprakları aşağıda toplanmışlar. align-contentkuralını kullanarak kurbağaları oraya yönlendirin.

                ', + 'az': '

                Bu göldə zanbaq yarpaqları aşağıda toplanıblar. align-content qaydasını istifadə edərək qurbağaları oraya yönləndirin.

                ', + 'it': '

                Ora la corrente ha trasportato le ninfee alla fine dello stagno. Guida lì le rane utilizzando align-content.

                ', + 'ko': '

                이제 연못의 조류에 의해 수련잎들이 연못의 아래쪽으로 떠내려 갔습니다. align-content를 사용하여 개구리들이 수련잎 위로 이동할 수 있도록 도와주세요.

                ', + 'lt': '

                Dabar srovė nunešė lelijos lapus į tvenkinio apačią. Naudodami align-content padėkite varlytėms pasiekti lelijas.

                ', + 'vi': '

                Hiện tại những lá bông súng ở phía dưới. Sử dụng align-content để hướng dẫn các chú ếch đến chỗ đó.

                ', + 'pl': '

                Tym razem listki odpłynęły na dół stawu. Przy pomocy align-content pomóż żabkom do nich dotrzeć.

                ', + 'cs': '

                Teď proud zanesl lekníny dolů. Pomozte žabkám vlastností align-content.

                ', + 'ja': '

                さて今回は蓮の葉は下へ詰められています。align-contentを使って、カエルたちをそこまで導いてください。

                ', + 'hu': '

                Jelen esetben a tündérrózsák a tó alján csoportosulnak. Használd az align-content tulajdonságot, hogy a békákat odavezesd hozzájuk.

                ', + 'eo': '

                Nun la akvofluo amasigas la nimfeofoliojn je la fundo. Uzu align-content por gvidi la ranojn tien.

                ', + 'sv': '

                Nu har blombladen flyttat sig till botten. Använd align-content för att flytta grodorna dit.

                ', + 'uk': '

                Тепер течією віднесло листя латаття до нижнього краю. Скористайся align-content, щоб скерувати жабенят на листя.

                ', + 'hi': '

                अब लिली के पत्ते तालाब के अंत में आ गये हैं। align-content का इस्तेमाल कर मेंढकों को पत्तों तक पहुंचाइये।

                ', + 'sr': '

                Сада су локвањи груписани у дну. Користи align-content да помериш жабице.

                ', + 'bs': '

                Sada su listovi grupisani u dnu. Koristi align-content da pomjeriš žabice.

                ', + 'hr': '

                Sada su listovi grupirani u dnu. Koristi align-content da pomakneš žabice.

                ', + 'nl': '

                Een sterke stroming heeft de lelieblaadjes helemaal naar beneden gestuwd. Gebruik align-content om de kikkers naar daar te brengen.

                ', + 'ta': '

                align-content பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

                ', + 'te': '

                ఇప్పుడు కరెంట్ కింది భాగంలో లిల్లీప్యాడ్లను బంచ్ చేసింది. అక్కడ కప్పలకు మార్గనిర్దేశం చేయడానికి align-content ని ఉపయోగించండి.

                ', + 'ml': '

                തിര കാരണം താമര ഇലകൾ താഴേക്കു വന്നിരിക്കുന്നു. align-content ഉപയോഗിച്ച് തവളകളെ വഴി കാണിക്കുക.

                ', + 'el': '

                Τώρα το ρεύμα έχει μαζέψει τα νούφαρα στο κάτω μέρος. Χρησιμοποιήστε το align-content για να οδηγήσετε τους βατράχους εκεί.

                ', + 'mk': '

                Сега струјата ги има собрано листовите на долниот крај. Користете align-content да ги насочите жабите натаму.

                ', + 'lv': '

                Straume ir aiznesusi ūdensrozes uz leju. Lieto align-content un nogādā arī vardulēnus tur.

                ', + 'id': '

                Saat ini ada banyak lilypad dibawah. Gunakan align-content untuk mengarahkan katak.

                ', + 'ar': '

                الان تم حشر اوراق الزنبق في الاسفل. استخدم align-content لنقل الضفادع اليها.

                ', + 'ca': '

                Ara, la corrent ha agrupat els nenúfars en la part inferior. Utilitza align-content per guiar las granotes fins allí.

                ', + 'da': '

                Nu har strømmen trukket alle åkanderne ned i bunden. Brug align-content til at lede frøerne derned.

                ', + 'et': '

                Nüüd on vool viinud vesiroosilehed alla. Kasuta align-content, et konnad sinna juhatada.

                ', + 'fi': '

                Nyt virtaus on kasannut lumpeenlehdet lammen alareunaan. Opasta sammakot sinne align-content-ominaisuuden avulla.

                ', + 'gl': '

                A corrente levou os nenúfares ata o fondo. Emprega align-content para levar as rás ata alí.

                ', + 'th': '

                ตอนนี้สายน้ำได้พาใบบัวไปรวมกันอยู่ด้านล่าง ใช้คำสั่ง align-content เพื่อนำเจ้ากบไปที่นั่น

                ', + 'mn': '

                Одоо цөөрмийн урсгал нь сараана цэцэгсийг доод талд бөөгнөрүүлсэн байна. Мэлхийнүүдийг тийш чиглүүлэхийн тулд align-content-г ашиглана уу.

                ' + }, + board: 'ggggggggggggggg', + classes: { '#pond, #background': 'wrap' }, + style: { 'align-content': 'flex-end' }, + before: "#pond {\n display: flex;\n flex-wrap: wrap;\n", + after: "}" + }, + { + name: 'align-content 3', + instructions: { + 'en': '

                The frogs have had a party, but it is time to go home. Use a combination of flex-direction and align-content to get them to their lilypads.

                ', + 'he': '

                הצפרדעים עשו מסיבה, אבל הגיע הזמן לחזור הביתה. השתמשו בשילוב של flex-direction ושל align-content כדי שהן יגיעו לעלים.

                ', + 'ro': '

                Broaștele au avut o petrecere, dar este timpul să meargă acasă. Folosește o combinație de flex-direction și align-content pentru a le duce la nuferi.

                ', + 'bg': '

                Жабчетата са били на купон, но сега е време да се прибират вкъщи. Използвай комбинация от flex-direction и align-content, за да ги насочиш до техните листа.

                ', + 'de': '

                Die Frösche haben eine Party gefeiert, aber nun ist es Zeit, nach Hause zu gehen. Benutze eine Kombination aus flex-direction und align-content, um sie zu ihren Seerosenblättern zu führen.

                ', + 'pt-br': '

                Os sapos fizeram uma festa, mas é hora de ir para casa. Use uma combinação de flex-direction e align-content para levá-los até suas vitórias-régias.

                ', + 'es': '

                Las ranas han tenido una fiesta, pero es momento de volver a casa. Usa una combinación de flex-direction y align-content para llevarlas a sus hojas de lirio.

                ', + 'fr': '

                Les grenouilles ont fait la fête, mais elles doivent maintenant retourner à la maison. Utilisez une combinaison de flex-direction et align-content pour les ramener à leurs nénuphars.

                ', + 'ru': '

                Лягушата были на вечеринке, но уже пора возвращаться домой. Используй комбинацию flex-direction и align-content, чтобы отправить их к своим лилиям.

                ', + 'fa': '

                قورباغه ها یک مهمونی داشتند, اما الان دیگه زمان رفتن به خانه است. با استفاده از خاصیت های flex-direction و align-content کمک کنید به نیلوفر های آبی خود برسند.

                ', + 'zh-cn': '

                青蛙们开完了派对，现在该回家了。用flex-direction和align-content的组合来把它们带回各自的家。

                ', + 'zh-tw': '

                青蛙們開完了派對，現在該回家了。用flex-direction和align-content的組合來把它們帶回各自的家。

                ', + 'tr': '

                Kurbağalar partideler, ama eve dönme vakti geldi. flex-direction ve align-content kombinasyonunu kullanarak kurbağaları kendi nilüfer yapraklarına götürün.

                ', + 'az': '

                Qurbağalar partidədilər, amma artıq evə qayıtmaq zamanıdır. flex-direction və align-content kombinasiyasını istifadə edərək qurbağaları öz zanbaq yarpaqlarına götürün.

                ', + 'it': '

                Le rane hanno fatto una grande festa ma adesso è ora di tornare a casa. Usa flex-direction e align-content per riportarle verso le ninfee.

                ', + 'ko': '

                개구리들이 신나는 파티를 가졌습니다. 이제는 집으로 돌아가야할 시간입니다. flex-direction과 align-content를 사용하여 개구리들이 자기 색깔과 같은 수련잎으로 돌아갈 수 있도록 도와주세요.

                ', + 'lt': '

                Varlytės surengė vakarėlį, tačiau jau laikas keliauti namo. Panaudokite flex-direction ir align-content kombinaciją, kad padėtumėte joms pasiekti savo lelijos lapus.

                ', + 'vi': '

                Những chú ếch đã có một bữa tiệc, nhưng đã đến lúc để về nhà. Kết hợp thuộc tính flex-direction và align-content để đưa chúng về với những lá bông súng.

                ', + 'pl': '

                Żabki zrobiły sobie imprezkę, nadszedł jednak czas na powrót do domu. Przy pomocy własności flex-direction oraz align-content pomóż im dotrzeć do ich listków.

                ', + 'cs': '

                Žabky oslavovaly, teď je však čas jít domů. Pomozte jim vlastnostmi flex-direction a align-content.

                ', + 'ja': '

                カエルたちはパーティーを開いていましたが、もう家に帰る時間です。flex-directionとalign-contentの組み合わせを使って、彼らの蓮の葉まで連れて行ってあげましょう。

                ', + 'hu': '

                A békák jót buliztak, de ideje hazamenniük. Használd együttesen a flex-direction és az align-content tulajdonságokat, hogy visszajuttasd őket a saját tündérrózsáikra.

                ', + 'eo': '

                La ranoj havis feston, sed nune ili devu reveni hejmen. Uzu kombinon de flex-direction kaj align-content por ke ili revenu al ilaj akvolilifolioj.

                ', + 'sv': '

                Det har varit grodfest men nu är det dags att gå hem. Använd en kombination av flex-direction och align-content för att flytta hem dom till sina blomblad.

                ', + 'uk': '

                Жабенята були на вечірці, але прийшов час повертатися додому. Скористайся комбінацією властивостей flex-direction та align-content, щоб розсадити їх на своє листя латаття.

                ', + 'hi': '

                मेंढकों के सामूहिक भोज के बाद अब वक्त है घर जाने का, flex-direction एवं align-content के इस्तेमाल से इन सभी को घर पहुंचाइये।

                ', + 'sr': '

                Жабице су имале журку а сада је време да се иде кући. Користи комбинацију flex-direction и align-content да их вратиш на њихове локвање.

                ', + 'bs': '

                Žabice su imale žurku a sada je vrijeme da se ide kući. Koristi kombinaciju flex-direction i align-content da ih vratiš na njihove lokvanje.

                ', + 'hr': '

                Žabice su se zabavile a sada je vrijeme da se ide kući. Koristi kombinaciju flex-direction i align-content da ih vratiš na njihove lopoče.

                ', + 'nl': '

                De kikkers hebben een feestje gehad, maar nu is het tijd om naar huis te gaan. Maak gebruik van een combinatie van flex-direction en align-content om ze terug naar hun lelieblaadjes te brengen.

                ', + 'ta': '

                flex-direction மற்றும் align-content பயன்படுத்தி தவளைகளுக்கு வழி காட்டவும்.

                ', + 'te': '

                కప్పలు పార్టీ చేసుకున్నారు, కాని ఇంటికి వెళ్ళే సమయం వచ్చింది. flex-direction మరియు align-content కలయికను వారి లిల్లీప్యాడ్‌లకు పొందడానికి ఉపయోగించండి.

                ', + 'ml': '

                തവളകൾ ഒരു പാർട്ടിക്കു പോയിരിക്കുക ആയിരുന്നു. പക്ഷെ ഇപ്പോൾ അവർക്കു തിരിച്ചു വീട്ടിൽ വരണം. flex-direction and align-content ഉപയോഗിച്ച് അവരെ താമര ഇലകളിലേക്കു എത്തിക്കു.

                ', + 'el': '

                Οι βάτραχοι έκαναν πάρτυ, αλλά ήρθε η ώρα να πάνε στα σπίτια τους. Χρησιμοποιήστε έναν συνδυασμό του flex-direction και του align-content για να τους πάτε στα νούφαρά τους.

                ', + 'mk': '

                Жабите имаа забава, но време е да си одат дома. Користете комбинација од flex-direction и align-content да ги доведете до нивните листови.

                ', + 'lv': '

                Vardulēniem bija sava ballīte, bet ir pienācis laiks doties mājās. Kombinējot flex-direction> un align-content, palīdzi katram vardulēnam nokļūt līdz savai ūdensrozei.

                ', + 'id': '

                Para katak mengadakan pesta, tapi sudah saatnya pulang. Gunakan kombinasi flex-direction dan align-content untuk mengantarkan mereka ke lilypads masing-masing.

                ', + 'ar': '

                كانت الضفادع في حفلة, لكن هذا وقت العودة الى المنزل. استخدم كل من flex-direction و align-content لاعادة الضفادع الى اوراق الزنبق الخاصة بها.

                ', + 'ca': '

                Les granotes han fet una festa, però ara ha arribat l\'hora de tornar a casa. Utilitza una combinació de flex-direction i align-content per portar-les als seus nenúfars.

                ', + 'da': '

                Frøerne har haft en fest, men nu er det på tide at komme hjem. Brug en kombination af flex-direction og align-content til at få dem hen til deres åkander.

                ', + 'et': '

                Konnadel on olnud pidu aga on aeg koju minna. Kasuta mõlemat, flex-direction ja align-content, et nad oma vesiroosilehtede juurde saada.

                ', + 'fi': '

                Sammakot ovat juhlineet, mutta nyt on aika palata koteihin. Opasta sammakot omille lumpeenlehdilleen käyttämällä ominaisuuksia flex-direction ja align-content yhdessä.

                ', + 'gl': '

                As rás foron de festa, pero xa é hora de ir indo para a casa. Combina flex-direction e align-content para levalas a cadanseu nenúfar.

                ', + 'th': '

                เจ้ากบเพิ่งจัดงานปาร์ตี้ไป, และถึงเวลากลับบ้านกันแล้ว ใช้คำสั่ง flex-direction และ align-content เพื่อเอามันไปสู่ใบบัวของมัน

                ', + 'mn': '

                Мэлхийнүүд үдэшлэг хийсэн ч гэртээ харих цаг нэгэнт болжээ. flex-direction болон align-content-н хослолыг ашиглан мэлхийнүүдийг сараана цэцэг рүү нь хүргэнэ үү.

                ' + }, + board: 'rgggyrgggyrgggy', + classes: { '#pond, #background': 'wrap' }, + style: { 'flex-direction': 'column-reverse', 'align-content': 'center' }, + before: "#pond {\n display: flex;\n flex-wrap: wrap;\n", + after: "}" + }, + { + name: 'align-content 4', + instructions: { + 'en': '

                Bring the frogs home one last time by using the CSS properties you\'ve learned:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'he': '

                תביאו את הצפרדעים הביתה פעם אחת אחרונה בעזרת שימוש בתכונות ה-CSS שלמדתם:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ro': '

                Adu broaștele acasă pentru ultima oară folosind proprietățile învățate:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'bg': '

                Закарай жабчетата вкъщи за последен път, използвайки CSS свойствата, които научи:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'de': '

                Bringe die Frösche ein letztes Mal mit allen gelernten CSS-Eigenschaften nach Hause:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'pt-br': '

                Leve os sapos para casa uma última vez utilizando as propriedades CSS que você aprendeu:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'es': '

                Trae a las ranas a su casa una vez más usando las propiedades CSS que aprendiste:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'fr': '

                Ramenez les grenouilles à la maison une dernière fois en utilisant les propriétés CSS que vous avez apprises :

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ru': '

                Доставь лягушат домой в последний раз, используя свойства CSS, которые ты выучил:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'fa': '

                برای آخرین بار با استفاده از Css به قورباغه ها کمک کنید تا به مقصد خود برسند. برای انجام این کار از خاصیت های زیر استفاده کنید :

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'zh-cn': '

                用这些你所学的CSS属性，最后一次把青蛙们带回家:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'zh-tw': '

                用這些你所學的CSS屬性，最後一次把青蛙們帶回家:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'tr': '

                Öğrendiğiniz tüm CSS kurallarını kullanarak kurbağaları son kez evlerine götürün:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'az': '

                Öyrəndiyiniz bütün CSS qaydalarını istifadə edərək qurbağaları son dəfə evlerinə götürün:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'it': '

                Riporta a casa le rane un\'ultima volta utilizzando le proprietà CSS che hai imparato:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ko': '

                지금까지 배운 CSS 속성들을 사용하여 개구리들이 집으로 돌아갈 수 있도록 한번 더 도와주세요:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'lt': '

                Parveskite varlytes namo paskutinį kartą, naudojant CSS komandas, kurias išmokote:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'vi': '

                Đưa những chú ếch về nhà một lần cuối cùng bằng cách sử dụng các thuộc tính CSS mà bạn đã học:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'pl': '

                Zaprowadź żabki do domu ten ostatni raz używając własności CSS, które właśnie poznałeś:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'cs': '

                Ještě jednou pomozte žabkám najít své lekníny CSS vlastnostmi, které jste se naučili:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ja': '

                これまでに習ったCSSプロパティーを使って、もう一度だけカエルたちを家まで連れていってあげてください。

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'hu': '

                Vidd haza a békákat még egyszer utoljára azon CSS tulajdonságok segítségével, amelyeket eddig tanultál:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'eo': '

                Revenigu la ranojn hejmen por lasta fojo uzante la CSS-ajn trajtojn kiujn vi lernis:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'sv': '

                Hjälp grodorna en sista gång genom att använda alla attribut du har lärt dig:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'uk': '

                Востаннє відправ жабенят додому використавши CSS-властивості, які ти вивчив:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'hi': '

                आपने अभी तक जितना सीखा है उसकी मदद से एक आखिरी बार सभी मेंढकों को पत्तों तक पहुंचाइये। सभी प्रॉपर्टीज की सूची :

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'sr': '

                Још једном за крај врати жабице кући користећи CSS својства која си научио/ла:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'bs': '

                Još jednom za kraj vrati žabice kući koristeći CSS svojstva koja si naučio/la:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'hr': '

                Još jednom za kraj vrati žabice kući koristeći CSS svojstva koja si naučio/la:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'nl': '

                Je bent er bijna! Leidt de kikkers nog een laatste keer naar huis door gebruik te maken van de CSS eigenschappen die je zonet geleerd hebt:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ta': '

                இதுவரை நீங்கள் கற்றுக்கொண்ட அணைத்து CSS properties கொண்டு தவளைகளை அதன் இலையின் மீது அமர உதவவும்:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'te': '

                మీరు నేర్చుకున్న CSS లక్షణాలను ఉపయోగించడం ద్వారా చివరిసారిగా కప్పలను ఇంటికి తీసుకురండి:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ml': '

                നിങ്ങൾ പഠിച്ച CSS പ്രോപ്പർട്ടികൾ ഉപയോഗിച്ച് ഒരു തവണ കൂടി തവളകളെ കൊണ്ടുവരിക:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'el': '

                Φέρτε τους βατράχους στα σπίτια τους μια τελευταία φορά χρησιμοποιώντας τις ιδιότητες CSS που μάθατε:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'mk': '

                Доведете ги жабите дома уште еден последен пат со користење на CSS својствата што ги научивте:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'lv': '

                Nogādā vardulēnus mājās vēl pēdējo reizi. Pielieto CSS metodes, ko Tev izdevās apgūt iepriekšējos līmeņos:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'id': '

                Bawa katak pulang sekali lagi mengunakan properti CSS yang telah kamu pelajari:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ar': '

                قم بتوصيل الضفادع الى منازلها لاخر مرة باستخدام خصائص الـCSS التي تعلمتها:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'ca': '

                Porta les granotes a casa seva una cop més utilitzant les propietats CSS que has aprés:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'da': '

                Hjælp frøerne hjem en sidste gang ved at bruge de CSS-egenskaber du har lært om:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'et': '

                Vii konnad veel üks kord koju kasutades neid CSS omadusi, mida sa õppinud oled:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'fi': '

                Opasta sammakot koteihinsa vielä viimeisen kerran käyttämällä oppimiasi CSS-ominaisuuksia:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'gl': '

                Pon ás rás no seu sitio unha vez máis empregando as propiedades CSS que aprendiches:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'th': '

                นำเจ้ากบกลับบ้านอีกครั้ง โดยใช้คุณสมบัติ CSS ที่คุณได้เรียนมา:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ', + 'mn': '

                Сүүлчийн удаа өөрийн сурсан CSS пропертинуудыг ашиглан мэлхийнүүдийг гэрт нь аваачина уу:

                • justify-content
                • align-items
                • flex-direction
                • order
                • align-self
                • flex-wrap
                • flex-flow
                • align-content
                ' + }, + board: 'rggggyy', + style: { 'flex-direction': 'column-reverse', 'flex-wrap': 'wrap-reverse', 'align-content': 'space-between', 'justify-content': 'center' }, + before: "#pond {\n display: flex;\n", + after: "}" + } +]; + +var levelWin = { + name: 'win', + instructions: { + 'en': '

                You win! Thanks to your mastery of flexbox, you were able to help all of the frogs to their lilypads. Just look how hoppy they are!

                If you found this ribbeting, be sure to visit Grid Garden to learn about another powerful new feature of CSS layout. You can also find other coding games over at Codepip. And be sure to share Flexbox Froggy with your friends!

                ', + 'he': '

                ניצחתם! תודות לשליטה שלכם ב-flexbox, הצלחתם לעזור לכל הצפרדעים להגיע לעלים שלהן. תראו כמה קופצניות ושמחות הן!

                אם זה עזר לכם להצפרדע קצת, בקרו ב-Grid Garden כדי ללמוד על עוד פיצ\'ר סידור חזק וחדש ב-CSS. אתם יכולים למצוא עוד משחקי תכנות ב-Codepip.

                רוצים ללמוד תוך כדי תמיכה ב-Flexbox Froggy?היכנסו ל- Treehouse. ושתפו את Flexbox Froggy עם חברים!

                ', + 'ro': '

                Ai câștigat! Mulțumită măiestriei tale în flexbox, ai reușit să ajuți toate broaștele să ajungă la nuferi. Uită-te cât de săltăreți sunt!

                Dacă ți s-a părut amuzant, vizitează Grid Garden pentru a învăța o nouă proprietate CSS. Poți, de asemenea, să-mi vezi celelalte proiecte pe blog-ul meu sau Twitter.

                Vrei să înveți sprijinând Flexbox Froggy? Incearcă cursurile de web design și codare oferite de Treehouse. Asigură-te că împarți Flexbox Froggy cu prietenii tăi!

                ', + 'bg': '

                Ти победи! Благодарение на майсторството ти с flexbox ти успя да помогнеш на всички жабчета да намерят своя дом!

                Ако тази игра ти е харесала, те каня да видиш и другите ми проекти в моя блог или Twitter, и не забравяй да споделиш Flexbox Froggy със своите приятели!

                ', + 'de': '

                Gewonnen! Dank deines flexbox-Könnens warst du in der Lage, alle Frösche zu ihrem Seerosenblatt zu führen. Sieh dir an, wie glücklich sie sind!

                Wenn dir das gefallen hat, schau dir meine anderen Projekte auf meinem Blog oder Twitter an und teile Flexbox Froggy mit deinen Freunden!

                ', + 'pt-br': '

                Você venceu! Graças à sua maestria de flexbox, você foi capaz de ajudar todos os sapos a chegar até suas vitórias-régias. Veja como eles estão felizes!

                Se você achou isso coaxante, confira meus outros projetos no meu blog ou Twitter, e compartilhe Flexbox Froggy com seus amigos!

                ', + 'es': '

                ¡Ganaste! Gracias a tu dominio de flexbox has sido capaz llevar a todas las ranas a sus nenúfares. ¡Basta con ver lo felices que son!

                Si te pareció divertido, revisa otros proyectos en mi blog o Twitter y asegúrate de compartir Flexbox Froggy con tus amigos.

                ', + 'fr': '

                Vous avez gagné! Grâce à votre maîtrise des flexbox, vous avez été capable d\'aider toutes les grenouilles à trouver leurs nénuphars. Regardez comment elles sautent de joie!

                Si vous avez trouvé cela amusant, regardez mes autres projets sur mon blog ou mon Twitter, et assurez-vous de partager Flexbox Froggy avec vos amis!

                ', + 'ru': '

                Ты выиграл! Благодарим тебя за мастерство flexbox, ты смог помочь всем лягушатам добраться до своих лилий. Просто взгляни, как они счастливы!

                Если тебе понравилось, зацени мои другие проекты в моем блоге или твитере, и не забудь поделиться этой игрой со своими друзьями!

                ', + 'fa': '

                شما برنده شدید! به همه قورباغه ها کمک کردید تا به نیلوفر های آبی خود برسند. آن ها خیلی خوشحال هستن و از شما تشکر می کنن!

                برای مشاهده پروژه های دیگر از طریق وبلاگ یا تویتتر مرا دنبال کنید, و حتما بازی آموزش فلکس باکس توسط قورباغه را با دوستان خود به اشتراک بگذارید !

                ', + 'zh-cn': '

                你赢了！正因为你对 flexbox 的了解，你帮助所有的青蛙回到了它们的荷叶上！看看它们跳得多开心！

                如果你觉得这个网站很有趣，请务必到 Grid Garden 来学习 CSS 布局的另一个强大新功能。你也可以在我的部落格或推特上查看我的其他项目。

                想要继续学习并支持 Flexbox Froggy 吗？请试试由 Treehouse 所提供的一流网页设计和编码课程，而且记得和你的朋友们分享 Flexbox Froggy 哦！

                ', + 'zh-tw': '

                你贏了！正因爲你對 flexbox 的了解，你幫助所有的青蛙回到了它們的荷葉上！看看它們跳得多開心！

                如果你覺得這個網站很有趣，請務必到 Grid Garden 來學習 CSS 佈局的另一個強大新功能。你也可以在我的部落格或推特上查看我的其他專案。

                想要繼續學習並支持 Flexbox Froggy 嗎？請試試由 Treehouse 所提供的一流網頁設計和編碼課程，而且記得和你的朋友們分享 Flexbox Froggy 哦！

                ', + 'tr': '

                Kazandınız! Flexbox ustalığınız sayesinde bütün kurbağaları nilüfer yapraklarına götürebildik. Bakın, ne kadar da mutlular!

                Eğer bunu beğendiyseniz, diğer projelerime blog ya da Twitter adreslerinden göz gezdirin, ve Flexbox Froggy oyununu arkadaşlarınızla paylaşın!

                ', + 'az': '

                Qazandınız! Flexbox ustalığınız sayəsində bütün qurbağaları zanbaq yarpaqlarına götürə bildik. Baxın, necə də xoşbəxtdirlər!

                Əgər bunu bəyəndizsə, digər proyektlərimə blog vəy a Twitter adreslərindən göz gəzdirin, və Flexbox Froggy oyununu dostlarınızla paylaşın!

                ', + 'it': '

                Hai vinto! Grazie alla tua conoscenza di flexbox sei riuscito ad aiutare tutte le rane a trovare la loro ninfea. Guarda come sono felici ora!

                Se hai trovato questo gioco interessante, visita il mio blog o il profilo Twitter per aggiornamenti sugli altri miei progetti. Non dimenticare di condividere Flexbox Froggy con i tuoi amici!

                ', + 'ko': '

                해냈습니다! 당신의 능숙한 Flexbox 솜씨 덕분에 모든 개구리들이 수련잎 위로 돌아가는 것을 도울 수 있었습니다. Froggy와 친구들이 기뻐하고 있군요!

                이 게임이 마음에 드셨다면 이곳에서 제 다른 프로젝트들을 확인해보세요: blog or Twitter 친구들과 함께 Flexbox Froggy를 즐기는 것도 잊지 마시고요!

                ', + 'lt': '

                Jūs laimėjote! Jūsų įvaldyto "flexbox" metodo dėka, sėkmingai pagelbėjote visoms varlytems pasiekti savo lelijos lapus. Tik pažiūrėkite kaip jos šokinėja iš džiaugsmo!

                Jei manote, kad šios pamokos Jums buvo naudingos, užmeskite akį į kitus mano projektus mano dienoraštyje ar Twitter paskyroje ir būtinai pasidalinkite "Flexbox Froggy" su draugais!

                ', + 'vi': '

                Chiến thắng! Nhờ sự thành thạo flexbox của bạn, bạn đã giúp tất cả các chú ếch trở về với những lá bông súng của chúng. Nhìn xem chúng hạnh phúc biết bao nhiêu!

                Nếu bạn thấy dự án này lôi cuốn, hãy xem các dự án khác của tôi trên blog hoặc là Twitter, và hãy chia sẻ Flexbox Froggy với bạn bè!

                ', + 'pl': '

                Wygrałeś! Dzięki twemu mistrzostwu w obsłudze flexboxa mogłeś pomóc wszystkim żabkom dotrzeć do swoich listków. Popatrz tylko jakie są szczęśliwe!

                Jeśli spodobała ci się gra obczaj inne moje projekty na moim blogu lub koncie Twittera, a także podziel się Flexbox Froggy z przyjaciółmi!

                ', + 'cs': '

                Vyhráli jste! Svým mistrovským použitím flexboxu jste pomohli všem žabkám najít své lekníny. Podívejte, jak jsou šťastné!

                Jestli se vám hra líbila, podívejte se i na mé další projekty na mém blogu nebo na Twitteru, a podělte se o radost z Flexbox Froggy s kamarády!

                ', + 'ja': '

                やりました！　flexboxを使いこなしてくれてありがとう。カエルたちをちゃんと蓮の葉まで連れて行ってくれました。ほら、すごく嬉しそうにしてますよ！

                楽しんでくれたのなら、ブログやTwitterで私の他のプロジェクトも探してみてください。Flexbox Froggyをお友達にシェアするのもお忘れなく！

                ', + 'hu': '

                Nyertél! A flexbox szakértelmednek köszönhetően minden békát sikeresen hazajuttattál a tündérrózsájára. Nézd csak, hogy ugrálnak örömükben!

                Ha eljutottál eddig a brekegésig, nézz rá további munkáimra a blogomon vagy a Twitteren, és feltétlenül oszd meg a Flexbox Froggy-t a barátaiddal!

                ', + 'eo': '

                Vi gajnas! Dank\'al via majstreco de flexbox, vi ja kapablis helpi ĉiujn ranojn reveni al iliaj akvolilifolioj. Rigardu kiel ili saltas pro ĝojeco!

                Se vi trovis amuzanta tiun ludon, bonvolu rigardi aliajn projektojn miajn je mia blogo aŭ Twitter, kaj bonvolu disdoni Flexbox Froggy-on al tutaj amikoj viaj!

                ', + 'sv': '

                Grattis, du vann! Tack vare dina mästarkunskaper kring flexbox lyckades du hjälpa alla grodorna till sina blomblad. Se bara hur glada dom är!

                Om du tyckte detta var spännande, spana in mina övriga projekt på min blogg eller Twitter och dela gärna Flexbox Froggy med dina vänner!

                ', + 'uk': '

                Ти виграв! Завдяки твоїй майстерності з flexbox, ти зміг допомогти всім жабенятам дістатися до їх листів латаття. Лиш подивись які вони щасливі!

                Якщо ця гра тобі сподобалась, переглянь мої інші проекти у блозі або Твітері, й не забудь поділитися грою Flexbox Froggy зі своїми друзями!

                ', + 'hi': '

                आप जीत गये! धन्यवाद flexbox में प्रभुत्व प्राप्त करने के लिए, आप सभी मेंढकों को उनके लिली के पत्तों तक पहुँचाने में सफल रहे। एक बार देखिये कितने खुश हैं वे सब।

                अगर आपको यह खेल पसंद आया तो आप मेरी अन्य योजनाओं को मेरे blog एवं Twitter पर देख सकते हैं। इस खेल को अपने अन्य दोस्तों में बांटना न भूलें, उन्हें भी मदद करें flexbox में महारत हासिल करने में।

                ', + 'sr': '

                Победио/ла си! Захваљујући одличном познавању флексбокса, могао/ла си да помогнеш жабицама да стигну до својих локвања. Погледај само како су сретне!

                Ако си уживао/ла, овери и моје пројекте на блогу или Твитеру и обавезно подели Flexbox Froggy са својим пријатељима!

                ', + 'bs': '

                Pobjedio/la si! Zahvaljujući odličnom poznavanju fleksboksa, mogao/la si da pomogneš žabicama da stignu do svojih listova. Pogledaj samo kako su sretne!

                Ako si uživao/la, pogledaj i moje projekte na blogu ili Twiteru i obavezno podjeli Flexbox Froggy sa svojim prijateljima!

                ', + 'hr': '

                Pobijedio/la si! Zahvaljujući odličnom poznavanju fleksboksa, mogao/la si pomoći žabicama da stignu do svojih listova. Pogledaj kako su samo sretne!

                Ako si uživao/la, pogledaj i moje projekte na blogu ili Twiteru i obavezno podjeli Flexbox Froggy sa svojim prijateljima!

                ', + 'nl': '

                Gewonnen! Dankzij je beheersing van flexbox was je in staat om alle kikkers te helpen hun lelieblaadjes te bereiken. Kijk eens hoe gelukkig ze zijn!

                Indien je dit al leuk vond, geef dan eens een kijkje naar mijn andere projecten op mijn blog of Twitter, en vergeet niet Flexbox Froggy te delen met je vrienden!

                ', + 'ta': '

                வெற்றி! வெற்றி!! Flexbox-ல் உங்கள் தேர்ச்சிக்கு நன்றி, தவளைகள் அதன் இலைகளை அடைய நீங்கள் செய்த உதவிக்கு மிக்க நன்றி. . தற்போது தவளைகள் தான் எவ்வளவு சந்தோஷமாக இருக்கின்றன!', + 'te': '

                మీరు గెలిచారు! ఫ్లెక్స్‌బాక్స్ యొక్క మీ పాండిత్యానికి ధన్యవాదాలు, మీరు కప్పలన్నింటినీ వారి లిల్లీప్యాడ్‌లకు చేరుకోవడానికి సహాయం చేసారు. వారు ఎంత ఉల్లాసంగా ఉన్నారో చూడండి!

                ఇది ఉపయోగకరంగా ఉంటే దినిని సందర్శించండి గ్రిడ్ గార్డెన్ CSS లేఅవుట్ యొక్క మరొక శక్తివంతమైన క్రొత్త లక్షణం గురించి తెలుసుకోవడానికి. మీరు కోడెపిప్ వద్ద ఇతర కోడింగ్ ఆటలను కూడా కనుగొనవచ్చు.

                ఫ్లెక్స్‌బాక్స్ ఫ్రాగ్గికి మద్దతు ఇస్తున్నప్పుడు నేర్చుకోవడం కొనసాగించాలనుకుంటున్నారా? ట్రీహౌస్ అందించే టాప్‌నోచ్ వెబ్ డిజైన్ మరియు కోడింగ్ కోర్సులను ప్రయత్నించండి. మరియు మీ స్నేహితులతో ఫ్లెక్స్‌బాక్స్ కప్పను ఖచ్చితంగా పంచుకోండి! ', + 'ml': '

                നിങ്ങൾ ജയിച്ചിരിക്കുന്നു! ഫ്ലസ്‌ബോസ് പേടിച്ചു കൊണ്ട് നിങ്ങൾ അല്ല താവളകളെയും ലക്ഷ്യസ്ഥാനത്തു എത്തിച്ചിരിക്കുന്നു. !

                ഇത് ഇഷ്ടപ്പെട്ടു എങ്കിൽ, കൂടുതൽ പഠിക്കാൻ സന്ദർശിക്കു Grid Garden ചെക്ക് ഔട്ട് my blog or Twitter.

                Flexbox Froggy- നെ പിന്തുണയ്ക്കുന്ന സമയത്ത് പഠിക്കുന്നത് തുടരണോ? നല്കിയ ടോപ്പ്നോട്ട് വെബ് ഡിസൈനും കോഡിംഗ് കോഴ്സും സന്ദർശിക്കുക Treehouse. നിങ്ങളുടെ സുഹൃത്തുക്കളുമായി Flexbox Froggy പങ്കിടുമെന്ന് ഉറപ്പാക്കുക!

                ', + 'el': '

                Νικήσατε! Χάρη στην γνώση σας του flexbox, μπορέσατε να βοηθήσετε όλους τους βατράχους να πάνε στα νούφαρά τους. Κοιτάξτε πόσο χοροπηδηχτοί είναι!

                Αν το βρήκατε αυτό συναρπαστικό, επισκεφτείτε το Grid Garden για να μάθετε για ένα άλλο ισχυρό νέο χαρακτηριστικό της διάταξης CSS. Μπορείτε επίσης να ελέγξετε τα άλλα έργα μου στο blog μου ή στο Twitter.

                Θέλετε να συνεχίσετε να μαθαίνετε υποστηρίζοντας το Flexbox Froggy; Δοκιμάστε τα εξαιρετικά μαθήματα web design και προγραμματισμού που προσφέρονται από το Treehouse. Και μοιραστείτε το Flexbox Froggy με τους φίλους σας!

                ', + 'mk': '

                Победивте! Благодарение на вашето мајсторство со flexbox, можевте да им помогнете на сите жаби да стигнат до своите листови. Само погледнете колку се среќни!

                Доколку ви беше возбудливо, ве покануваме да го посетите Grid Garden да научите за уште моќна функција за CSS распоредување. Исто така можете и да ги погледнете моите други проекти на мојот блог или Twitter.

                Сакате да продолжите со учење додека и го поддржувате Flexbox Froggy? Пробајте ги курсевите за веб дизајн и кодирање од Treehouse. И не заборавајте да го споделите Flexbox Froggy со вашите пријатели!

                ', + 'lv': '

                Spēle galā, Tu uzvarēji! Pateicoties savām "flexbox" zināšanām, Tu spēji nogādāt visus vardulēnus drošībā. Paskaties, cik viņi tagad ir priecīgi!

                Ja Tev šis interesēja, tad noteikti iegriezies arī Grid Garden, lai apgūtu vēl vienu ļoti vērtīgu CSS izvietojuma metodi. Tāpat iesaku Tev apskatīt manus pārējos projektus manā blogā vai Twitter.

                Vēlies turpināt mācības un arī palīdzēt Flexbox Froggy attīstībai? Pamēģini augstākā līmeņa dizaina un programmēšanas kursus Treehouse. Neaizmirsti arī parādīt Flexbox Froggy saviem draugiem!

                ', + 'id': '

                Kamu menang! Berkat penguasaan flexbox kamu, kamu dapat membantu semua Froggy untuk lilypads mereka. Lihat betapa "bahagia" mereka!

                Jika kamu menemukan ini menyenangkan, pastikan untuk mengunjungi Grid Garden untuk mempelajari hal penting CSS layout. Kamu juga bisa menemukan permainan coding di Codepip.

                Ingin tetap bermain sambil mendukunng Flexbox Froggy tetap ada? Cobalah kursus desain dan pengkodean web terbaik yang ditawarkan oleh Treehouse. Dan jangan lupa bagikan Flexbox Froggy kepada teman-teman kamu!

                ', + 'ar': '

                لقد فزت! لقد استطعت مساعدة جميع الضفادع للوصول الى اوراق الزنبق الخاصة بهم. انظر كم هم سعداء!

                قم بزيارة حديقة جريد (Grid) لتتعلم عن نمط تنسيق اخر في CSS . يمكنك ايضًا العثور على العاب برمجية اخرى في Codepip.

                تريد مواصلة التعلم مع دعم فروغي فلكسبكس؟ جرب دورات التصميم والبرمجة التي تقدمها Treehouse. نأمل ان تشارك فروغي فلكسبكس مع أصدقاءك!

                ', + 'ca': '

                Has guanyat! Gràcies al teu domini de flexbox, has estat capaç d\'ajudar a totes les granotes a arribar als seus nenúfars. Només cal veure què felices estan!!

                Si t\'ha semblat divertit, revisa altres projectes en el meu blog o Twitter i assegurat de compartir Flexbox Froggy amb els teus amics.

                ', + 'da': '

                Du vinder! Takket være dine evner inden for flexbox kunne du hjælpe alle frøerne hjem til deres åkander. Se bare hvor de hopper!

                Hvis du syntes det her var "frø"-scinerende kan du også prøve Grid Garden, hvor du kan lære om en anden ny og brugbar funktion i CSS. Du kan også finde andre spil om kode på Codepip.

                Vil du blive ved med at lære mens du støtter Flexbox Froggy? Prøv de glimrende kurser i web design og kodning fra Treehouse. Og del Flexbox Froggy med dine venner!

                ', + 'et': '

                Sa võitsid! Tänu sinu meisterlikkusele flexbox\'i osas, suutsid sa aidata kõik konnad oma vesiroosilehtedele. Vaata kui õnnelikud nad on!

                Kui sa arvasid, et see oli krooksumaajavalt hea, siis külasta kindlasti ka Grid Garden, et õppide veel ühe võimsa CSS paigutusemeetodi kohta. Lisaks sellele võid leida ka muid koodimimänge siit Codepip.

                Tahad jätkata õppimist toetades Flexbox Froggy\'t? Proovi toredaid veebidisaini ja koodimise kursusi mida pakub Treehouse. Jaga kindlasti Flexbox Froggy\'t oma sõpradega!

                ', + 'fi': '

                Hurraa! Mestarillisten flexbox-taitojesi ansiosta kaikki sammakot löysivät omat lumpeenlehtensä. Katso, kuinka ne hyppivät ilosta!

                Jos pidit tästä seikkailusta, kokeile myös Grid Garden -peliä, jossa tutustut toiseen mahtavaan CSS-asetteluominaisuuteen. Lisää koodailupelejä löytyy Codepip-sivustolta.

                Haluaisitko oppia lisää ja samalla tukea Flexbox Froggy -peliä? Tutustu Treehousen websuunnittelu- ja koodauskursseihin. Äläkä unohda kertoa Flexbox Froggysta ystävillesi!

                ', + 'gl': '

                Gañaches! Grazas ao teu dominio do flexbox, fuche quen de axudar a todas as rás a chegar ás súas follas de nenúfar. Mira que contentiñas están!

                Se o pasaches ben, xoga tamén ao Grid Garden para aprenderes outra nova característica de CSS. Tamén podes atopar máis xogos de programación en Codepip.

                Queres seguir aprendendo mentres apoias Flexbox Froggy? Probas os cursos de deseño web e programación de Treehouse. E non esquezas compartir o Flexbox Froggy cos teus amigos!

                ', + 'th': '

                คุณชนะ! ด้วยความเชี่ยวชาญด้าน flexbox ของคุณ, คุณสามารถช่วยเหลือให้เจ้ากบทั้งหมดไปสู่ใบบัวของมัน ดูสิว่ามันมีความสุขแค่ไหน!

                ถ้าคุณชอบเจ้ากบ, ต้องแวะมาที่ Grid Garden เพื่อเรียนรู้เกี่ยวกับจุดเด่นใหม่ของการจัดวางด้วย CSS ที่เป็นประโยชน์อย่างมาก คุณยังสามารถหาเกมเกี่ยวกับการเขียนโปรแกรมอื่นๆที่ Codepip. และอย่าลืมแชร์ Flexbox Froggy ให้เพื่อนๆของคุณด้วยล่ะ!

                ', + 'mn': '

                Та яллаа! Flexbox-г сайн эзэмшсэнийхээ ачаар та бүх мэлхийнүүдийг сараана цэцэгтэй болгоход нь тусалж чадлаа. Тэд ямар их баяртай байгааг хараарай!

                Хэрвээ энэ тоглоом таньд хөгжилтэй санагдсан бол Grid Garden-д зочлоорой. CSS layout-н өөр нэг хүчирхэг онцлогын талаар мэдэхийг хүсвэл Codepip-с бусад кодчилолын тоглоомуудыг олж тоглох боломжтой. Мөн Flexbox Froggy-г найзуудтайгаа хуваалцахаа мартуузай!

                ' + }, + board: 'gyrgyrgyrgyrgyrgyrgyrgyrg', + classes: { '#pond, #background': 'wrap' }, + style: {}, + before: "#pond {\n display: flex;\n", + after: "}" +}; diff --git a/src/Games/Flexcode/js/messages.js b/src/Games/Flexcode/js/messages.js new file mode 100644 index 00000000..eb41ae8b --- /dev/null +++ b/src/Games/Flexcode/js/messages.js @@ -0,0 +1,639 @@ +var messages = { + languageActive: { + 'en': 'English', + 'he': 'עברית', + 'ro': 'Română', + 'sr': 'Српски', + 'bs': 'Bosanski', + 'hr': 'Hrvatski', + 'bg': 'Български', + 'de': 'Deutsch', + 'fr': 'Français', + 'pt-br': 'Português', + 'es': 'Español', + 'ru': 'Русский', + 'fa': 'فارسی', + 'zh-cn': '简体中文', + 'zh-tw': '繁體中文', + 'tr': 'Türkçe', + 'az': 'Azərbaycanca', + 'it': 'Italiano', + 'ko': '한국어', + 'lt': 'Lietuvių', + 'vi': 'Tiếng Việt', + 'pl': 'Polski', + 'cs': 'Česky', + 'ja': '日本語', + 'hu': 'Magyar', + 'eo': 'Esperanto', + 'sv': 'Svenska', + 'uk': 'Українська', + 'hi': 'हिंदी', + 'nl': 'Nederlands', + 'ta': 'தமிழ்', + 'te': 'తెలుగు', + 'ml': 'മലയാളം', + 'el': 'Ελληνικά', + 'mk': 'Македонски', + 'lv': 'Latviešu', + 'id': 'Bahasa Indonesia', + 'ar': 'العربية', + 'ca': 'Català', + 'da': 'Dansk', + 'et': 'Eesti', + 'fi': 'Suomi', + 'gl': 'Galego', + 'th': 'ไทย', + 'mn': 'Монгол хэл' + }, + next: { + 'en': 'Next', + 'he': 'הבא', + 'ro': 'Următorul', + 'sr': 'Следећи', + 'bs': 'Dalje', + 'hr': 'Dalje', + 'bg': 'Следващо', + 'de': 'Weiter', + 'fr': 'Suivant', + 'pt-br': 'Próximo', + 'es': 'Siguiente', + 'ru': 'Следующий', + 'fa': 'مرحله بعدی', + 'zh-cn': '继续', + 'zh-tw': '繼續', + 'tr': 'Sonraki', + 'az': 'Növbəti', + 'it': 'Prossimo', + 'ko': '다음', + 'lt': 'Sekantis', + 'vi': 'Kế Tiếp', + 'pl': 'Dalej', + 'cs': 'Pokračovat', + 'ja': '次へ', + 'hu': 'Következő', + 'eo': 'Sekva', + 'sv': 'Nästa', + 'uk': 'Наступний', + 'hi': 'अगला', + 'nl': 'Volgende', + 'ta': 'அடுத்து', + 'te': 'తరువాత', + 'ml': 'അടുത്തത്', + 'el': 'Επόμενο', + 'mk': 'Следно', + 'lv': 'Nākamais', + 'id': 'Lanjut', + 'ar': 'التالي', + 'ca': 'Següent', + 'da': 'Næste', + 'et': 'järgmine', + 'fi': 'Seuraava', + 'gl': 'Seguinte', + 'th': 'ถัดไป', + 'mn': 'Дараах' + }, + labelFooter: { + 'en': 'Flexbox Froggy is created by', + 'he': 'Flexbox Froggy נוצר על ידי', + 'ro': 'Flexbox Froggy este creat de', + 'sr': 'Flexbox Froggy је направио', + 'bs': 'Flexbox Froggy je napravio', + 'hr': 'Flexbox Froggy je stvorio', + 'bg': 'Flexbox Froggy е създадена от', + 'de': 'Flexbox Froggy wurde gemacht von', + 'fr': 'Flexbox Froggy est créé par', + 'pt-br': 'Flexbox Froggy foi criado por', + 'es': 'Flexbox Froggy es una creación de', + 'ru': 'Игра Flexbox Froggy создана', + 'fa': 'قورباغه فلکس باکس ساخته شده توسط', + 'zh-cn': 'Flexbox Froggy的作者是', + 'zh-tw': 'Flexbox Froggy的作者是', + 'tr': 'Flexbox Froggy\'nin yaratıcısı:', + 'az': 'Flexbox Froggy\'nin qurucusu:', + 'it': 'Flexbox Froggy è stato creato da', + 'ko': 'Flexbox Froggy는 다음에 의해 개발되었습니다', + 'lt': 'Flexbox Froggy kūrėjas', + 'vi': 'Flexbox Froggy được tạo ra bởi', + 'pl': 'Flexbox Froggy jest wytworem', + 'cs': 'Flexbox Froggy vytvořil', + 'ja': 'Flexbox Froggy is created by', + 'hu': 'A Flexbox Froggy-t készítette', + 'eo': 'Flexbox Froggy far', + 'sv': 'Flexbox Froggy skapades av', + 'uk': 'Гру Flexbox Froggy створено', + 'hi': 'Flexbox Froggy के निर्माणकर्ता ', + 'nl': 'Flexbox Froggy is gemaakt door', + 'ta': 'Flexbox Froggy உருவாக்கியவர்', + 'te': 'Flexbox Froggy చేసిన వారు', + 'ml': 'Flexbox Froggy സൃഷ്ടിച്ചത്', + 'el': 'Το Flexbox Froggy δημιουργήθηκε από', + 'mk': 'Flexbox Froggy е создадено од', + 'lv': 'Flexbox Froggy autori ir', + 'id': 'Flexbox Froggy dibuat oleh', + 'ar': 'تم انشاء فروغي فلكسبكس بواسطة', + 'ca': 'Flexbox Froggy és una creació de', + 'da': 'Flexbox Froggy er skabt af', + 'et': 'Flexbox Froggy on looja on', + 'fi': 'Flexbox Froggyn on tehnyt', + 'gl': 'Flexbox Froggy creouno', + 'th': 'Flexbox Froggy ถูกสร้างโดย', + 'mn': 'Flexbox Froggy is created by' + }, + labelLevel: { + 'en': 'Level', + 'he': 'שלב', + 'ro': 'Nivelul', + 'sr': 'Ниво', + 'bs': 'Nivo', + 'hr': 'Nivo', + 'bg': 'Ниво', + 'de': 'Level', + 'fr': 'Niveau', + 'pt-br': 'Nível', + 'es': 'Nivel', + 'ru': 'Уровень', + 'fa': 'مرحله', + 'zh-cn': 'Level', + 'zh-tw': 'Level', + 'tr': 'Seviye', + 'az': 'Səviyyə', + 'it': 'Livello', + 'ko': '단계', + 'lt': 'Lygis', + 'vi': 'Cấp', + 'pl': 'Poziom', + 'cs': 'Úroveň', + 'ja': 'Lv.', + 'hu': 'Szint', + 'eo': 'Nivelo', + 'sv': 'Nivå', + 'uk': 'Рівень', + 'hi': 'स्तर', + 'nl': 'Niveau', + 'ta': 'நிலை', + 'te': 'గట్టం', + 'ml': 'നില', + 'el': 'Επίπεδο', + 'mk': 'Ниво', + 'lv': 'Līmenis', + 'id': 'Tingkat', + 'ar': 'المرحلة', + 'ca': 'Nivell', + 'da': 'Niveau', + 'et': 'Tase', + 'fi': 'Kenttä', + 'gl': 'Nivel', + 'th': 'เลเวล', + 'mn': 'Үе' + }, + labelOf: { + 'en': 'of', + 'he': 'מתוך', + 'ro': 'din', + 'sr': 'од', + 'bs': 'od', + 'hr': 'od', + 'bg': 'от', + 'de': 'von', + 'fr': 'de', + 'pt-br': 'de', + 'es': 'de', + 'ru': 'из', + 'fa': 'از', + 'zh-cn': '/', + 'zh-tw': '/', + 'tr': '/', + 'az': '/', + 'it': 'di', + 'ko': 'of', + 'lt': 'iš', + 'vi': 'của', + 'pl': 'z', + 'cs': 'z', + 'ja': '/', + 'hu': '/', + 'eo': 'de', + 'sv': 'av', + 'uk': 'з', + 'hi': '/', + 'nl': 'van', + 'ta': '/', + 'te': '/', + 'ml': '/', + 'el': 'από', + 'mk': 'од', + 'lv': 'no', + 'id': 'dari', + 'ar': 'من', + 'ca': 'de', + 'da': 'af', + 'et': '/', + 'fi': '/', + 'gl': 'de', + 'th': '/', + 'mn': '/' + }, + title: { + 'en': 'Flexcode', + 'he': 'Flexbox Froggy - משחק ללמידת CSS flexbox', + 'ro': 'Flexbox Froggy - Un joc pentru a învăța CSS flexbox', + 'sr': 'Flexbox Froggy - Игра за учење CSS flexbox-а', + 'bs': 'Flexbox Froggy - Igra za učenje CSS flexbox-a', + 'hr': 'Flexbox Froggy - Igra za učenje CSS flexboxa', + 'bg': 'Flexbox Froggy - Игра за учене на CSS flexbox', + 'de': 'Flexbox Froggy - Ein Spiel, um CSS flexbox zu lernen', + 'fr': 'Flexbox Froggy - Un jeu pour apprendre les flexbox CSS', + 'pt-br': 'Flexbox Froggy - Um jogo para aprender CSS flexbox', + 'es': 'Flexbox Froggy - Un juego para aprender CSS flexbox', + 'ru': 'Flexbox Froggy - игра для изучения CSS flexbox', + 'fa': 'قورباغه فلکس باکس - یک بازی جذاب برای آموزش سی اس اس فلکس باکس', + 'zh-cn': 'Flexbox Froggy - 一个用来学CSS flexbox的游戏', + 'zh-tw': 'Flexbox Froggy - 一個用來學CSS flexbox的遊戲', + 'tr': 'Flexbox Froggy - CSS flexbox için öğretici oyun', + 'az': 'Flexbox Froggy - CSS flexbox üçün öyrədici oyun', + 'it': 'Flexbox Froggy - Un gioco per imparare CSS flexbox', + 'ko': 'Flexbox Froggy - CSS flexbox 속성 배우기 게임', + 'lt': 'Flexbox Froggy - Žaidimas padėsiantis perprasti CSS "flexbox" metodiką', + 'vi': 'Flexbox Froggy - Một trò chơi để học CSS flexbox', + 'pl': 'Flexbox Froggy - Gra wprowadzająca do CSS flexbox"', + 'cs': 'Flexbox Froggy - CSS flexbox hrou', + 'ja': 'Flexbox Froggy - CSS flexbox学習ゲーム', + 'hu': 'Flexbox Froggy - Játékos CSS flexbox tanulás', + 'eo': 'Flexbox Froggy - Ludo por lerni CSS flexbox-on', + 'sv': 'Flexbox Froggy - Ett spel för att lära sig CSS flexbox', + 'uk': 'Flexbox Froggy - гра для вивчення CSS flexbox', + 'hi': 'Flexbox Froggy - CSS Flexbox सीखने के लिए एक खेल', + 'nl': 'Flexbox Froggy - Een spel om CSS flexbox te leren', + 'ta': 'Flexbox Froggy - CSS flexbox கற்றல் விளையாட்டு', + 'te': 'Flexbox Froggy - CSS Flexbox నేర్చుకోవడానికి ఒక ఆట', + 'ml': 'Flexbox Froggy - CSS Flexbox പഠിക്കാം', + 'el': 'Flexbox Froggy - Ένα παιχνίδι για την εκμάθηση του CSS Flexbox', + 'mk': 'Flexbox Froggy - Игра за учење на CSS flexbox', + 'lv': 'Flexbox Froggy - Spēle, kas Tev palīdzēs iemācīties CSS Flexbox', + 'id': 'Flexbox Froggy - Sebuah permainan untuk belajar CSS flexbox', + 'ar': 'فروغي فلكسبكس - لعبة لتعلم الفلكسبكس في CSS', + 'ca': 'Flexbox Froggy - Un joc per aprendre CSS Flexbox', + 'da': 'Flexbox Froggy - Et spil, der lærer dig CSS Flexbox', + 'et': 'Flexbox Froggy - Mäng CSS flexbox\'i õppimiseks', + 'fi': 'Flexbox Froggy - Peli, jossa opit CSS flexbox -asettelun', + 'gl': 'Flexbox Froggy - Un xogo para aprenderes CSS Flexbox', + 'th': 'Flexbox Froggy - เกมสำหรับเรียนรู้ CSS Flexbox', + 'mn': 'Flexbox Froggy - CSS flexbox-г сурах тоглоом' + }, + labelReset: { + 'en': 'Reset', + 'he': 'איפוס', + 'ro': 'Resetează', + 'sr': 'Ресет', + 'bs': 'Restart', + 'hr': 'Restart', + 'bg': 'Анулиране', + 'de': 'Zurücksetzen', + 'fr': 'Réinitialiser', + 'pt-br': 'Reinicializar', + 'es': 'Reiniciar', + 'ru': 'Сбросить', + 'fa': 'شروع مجدد', + 'zh-cn': '重置', + 'zh-tw': '重置', + 'tr': 'Baştan Başla', + 'az': 'Yenidən Başla', + 'it': 'Annulla', + 'ko': '재시작', + 'lt': 'Atstatyti', + 'vi': 'Thiết lập lại', + 'pl': 'Uruchom ponownie', + 'cs': 'Nová hra', + 'ja': 'リセット', + 'hu': 'Újrakezd', + 'eo': 'Rekomenci', + 'sv': 'Återställ', + 'uk': 'Скинути', + 'hi': 'रीसेट', + 'nl': 'Resetten', + 'ta': 'மீளமை', + 'te': 'రీసెట్', + 'ml': 'പുനഃസജ്ജമാക്കുക', + 'el': 'Επαναφορά', + 'mk': 'Ресетирај', + 'lv': 'Dzēst rezultātus', + 'id': 'Atur Ulang', + 'ar': 'اعادة', + 'ca': 'Reiniciar', + 'da': 'Nulstil', + 'et': 'Lähtesta', + 'fi': 'Aloita alusta', + 'gl': 'Reiniciar', + 'th': 'เริ่มใหม่', + 'mn': 'Дахин эхлүүлэх' + }, + warningReset: { + 'en': 'Are you sure you want to reset the game?\n\nYour saved progress will be lost and you\'ll be sent to the start of the game.', + 'he': 'האם לאפס את המשחק?\n\nההתקדמות שנשמרה תימחק והמשחק יתחיל מחדש.', + 'ro': 'Ești sigur(ă) că vrei să resetezi jocul?\n\nProgresul tău va fi pierdut și vei fi trimis(ă) la începutul jocului.', + 'sr': 'Да ли сте сигурни да желите да ресетујете игру?\n\nВаш сачувани прогрес ће бити изгубљен и бићете враћени на почетак игре.', + 'bs': 'Da li ste sigurni da želite da resetujete igru?\n\nVaš sačuvani progres će biti izgubljen i bićete vraćeni na početak igre.', + 'hr': 'Jeste li sigurni da želite resetirati igru?\n\nVaš sačuvani progres će biti izgubljen i bit ćete vraćeni na početak igre.', + 'bg': 'Сигурни ли сте, че искате да анулирате играта?\n\nВашият резултат ще бъде загубен и ще бъдете препратени към началото на играта.', + 'de': 'Bist du sicher, dass du das Spiel zurücksetzen möchtest?\n\nDein gespeicherter Fortschritt geht dabei verloren und du musst das Spiel von neuem starten.', + 'fr': 'Êtes-vous certain de vouloir réinitialiser la partie?\n\nVotre progrès sauvegardé sera perdu et vous recommencerez au début du jeu.', + 'pt-br': 'Você tem certeza que quer reinicializar o jogo?\n\nSeu progresso salvo será perdido e você voltará ao começo do jogo.', + 'es': '¿Estás seguro de que quieres reiniciar el juego?\n\nTu progreso se perderá y serás enviado al inicio del juego.', + 'ru': 'Вы действительно хотите сбросить игру?\n\nВаш прогресс будет потерян и вы вернетесь к началу игры.', + 'fa': 'آیا از شروع مجدد بازی اطمینان دارید ?\n\nتمام مراحل ذخیره شده حذف خواهند شد.', + 'zh-cn': '你确定要重置游戏吗?\n\n你保存了的进度将会丢失，而且你会回到游戏的最开始。', + 'zh-tw': '你確定要重置遊戲嗎？\n\n你保存了的進度將會丟失，而且你會回到遊戲的最開始。', + 'tr': 'Oyuna baştan başlamak istediğinize emin misiniz? Kayıtlı bütün ilerlemeniz silinecek ve birinci seviyeye geri döneceksiniz.', + 'az': 'Oyuna yenidən başlamaq istədiyinizə əminsiniz? Qeyd edilən bütün addımlarınız silinəcək və birinci səviyyəyə geri dönəcəksiniz.', + 'it': 'Sei sicuro di voler annullare la partita?\n\nI tuoi salvataggi verranno persi e dovrai ricominciare il gioco dall\'inizio.', + 'ko': '게임을 다시 시작하시겠습니까? 지금까지의 진도는 사라지고 게임의 처음으로 돌아갈 것입니다.', + 'lt': 'Ar esate įsitikinę, kad norite atstatyti žaidimą į pradinę būseną?\n\nJūsų pasiekimai bus anuliuoti ir būsite nukreipti į žaidimo pradžią.', + 'vi': 'Bạn có chắc chắn là bạn muốn thiết lập lại trò chơi không? Toàn bộ tiến trình của bạn sẽ bị mất và bạn sẽ được chuyển đến đầu của trò chơi.', + 'pl': 'Na pewno chcesz uruchomić grę ponownie?\n\nUtracisz dotychczasowe postępy, a także powrócisz do początku gry.', + 'cs': 'Opravdu chcete restartovat hru?\n\nSoučasný postup bude smazán, začnete znovu od prvního levelu.', + 'ja': '本当にゲームをリセットしますか？\n\nここまで進めたゲームの情報は全て失われ、ゲームの最初へ移動します。', + 'hu': 'Biztosan előlről akarod kezdeni a játékot?\n\nAz eddig elért eredményed elveszik és a játék elején fogod találni magad.', + 'eo': 'Ĉu vi vere volas rekomenci la ludon?\n\nPerdiĝos via progresado kaj vi devos rekomenci al la komenco de la ludo.', + 'sv': 'Är du säker på att du vill börja om?\n\nDin nivå kommer att återställas och du kommer att börja om från början.', + 'uk': 'Ви насправді бажаєте скинути гру?\n\nВсі ваші надбання будуть втрачені й ви розпочнете з початку гри.', + 'hi': 'आप खेल रीसेट करना चाहते हैं, क्या आप सुनिश्चित हैं?\n\nआपकी सुरक्षित प्रगति मिटा दी जाएगी एवं आप इस खेल की शुरुआत में भेज दिये जायेंगे।', + 'nl': 'Ben je zeker dat je het spel wilt resetten?\n\nJe vooruitgang zal verloren gaan en je zal helemaal opnieuw moeten beginnen.', + 'ta': 'நீங்கள் விளையாட்டு மீட்டமைக்க உறுதியாக இருக்கிறீர்களா?\n\nநீங்கள் சேமித்த முன்னேற்றம் இழக்கப்படும் மேலும் நீங்கள் விளையாட்டின் தொடக்கத்திற்க்கு அனுப்பி வைக்கப்படுவீர்.', + 'te': 'మీరు ఆటను రీసెట్ చేయాలనుకుంటున్నారా? \n\n మీ కూడబెట్టుకున్న పురోగతి పోతుంది మరియు మీరు ఆట ప్రారంభానికి పంపబడతారు. ', + 'ml': 'ഗെയിം പുനഃസജ്ജമാക്കണമെന്ന് നിങ്ങൾക്ക് തീർച്ചയാണോ?\n\nനിങ്ങളുടെ സംരക്ഷിത പുരോഗതി നഷ്ടപ്പെടുകയും നിങ്ങൾ ആദ്യം മുതൽ ആരംഭിക്കേണ്ടി വരും ', + 'el': 'Είστε σίγουροι ότι θέλετε να επαναφέρετε το παιχνίδι;\n\nΗ αποθηκευμένη σας πρόοδος θα χαθεί και θα βρεθείτε στην αρχή του παιχνιδιού.', + 'mk': 'Дали сте сигурни дека сакате да ја ресетирате играта?\n\nВашиот зачуван прогрес ќе биде загубен и ќе бидете пратени на почетокот на играта', + 'lv': 'Vai tiešām vēlies dzēst spēles rezultātus?\n\nTevis saglabātais rezultāts tiks dzēsts un Tu tiksi atgriezts uz spēles pirmo līmeni.', + 'id': 'Apakah Anda yakin ingin mengatur ulang game?\n\n Proses Anda yang tersimpan akan hilang dan Anda akan dikirim ke awal game.', + 'ar': 'هل انت متأكد من إعادة اللعبة؟ \n\n ستفقد تقدمك وسيعاد توجيهك الى بداية اللعبة', + 'ca': 'Estàs segur que vols reiniciar el joc?\n\nEl teu progrès es perdrà i tornaràs a l\'inici del joc', + 'da': 'Er du sikker på at du vil nulstille spillet?\n\nDine fremskridt vil gå tabt, og du bliver sendt tilbage til starten af spillet.', + 'et': 'Oled sa kindel, et sa tahad mängu lähtestada?\n\nSinu salvestatud progress kustutatakse ja sind saadetakse mängu algusesse.', + 'fi': 'Haluatko varmasti aloittaa pelin alusta?\n\nTallennettu edistyminen menetetään, ja palaat ensimmäiseen kenttään.', + 'gl': 'Seguro que queres reiniciar a partida?\n\nPerderás todo o que leves feito e terás que comezar o xogo desde o principio.', + 'th': 'คุณแน่ใจหรือไม่ว่าต้องการเริ่มเกมใหม่?\n\nความคืบหน้าที่เก็บไว้ของคุณจะหายไป และคุณจะกลับไปเริ่มเกมใหม่', + 'mn': 'Та тоглоомыг дахин эхлүүлэхдээ итгэлтэй байна уу?\n\nТаны хадгалсан ахиц дэвшил алдагдаж, тоглоомын эхлэл рүү очих болно.' + }, + gridGarden: { + 'en': 'Want to learn CSS grid? Play', + 'he': 'רוצה ללמוד CSS grid? שחק', + 'bs': 'Želiš naučiti CSS grid? Igraj', + 'hr': 'Želiš li naučiti CSS grid? Igraj', + 'ro': 'Vrei să înveți CSS grid? Joacă', + 'de': 'Möchtest du CSS grid lernen? Spiele', + 'fr': 'Vous voulez apprendre CSS Grid ? Jouez à', + 'pt-br': 'Quer aprender CSS grid? Jogue', + 'ru': 'Хотите изучить CSS grid? Сыграйте в', + 'nl': 'Wil je CSS grid leren? Speel', + 'ta': 'CSS Grid கற்றுக்கொள்ள விரும்புகிறீர்களா? விளையாடுவோம்', + 'ml': 'CSS Grid പഠിക്കാനോ? കളിക്കു ', + 'el': 'Θέλετε να μάθετε CSS Grid; Παίξτε', + 'mk': 'Сакате да научите CSS grid? Играјте', + 'lv': 'Gribi apgūt CSS grid? Spēlē ', + 'it': 'Vuoi imparare CSS grid? Gioca a', + 'pl': 'Chcesz nauczyć się CSS Grid? Zagraj w', + 'id': 'Ingin mempelajari CSS grid? Main', + 'ar': 'تريد تعلم الجريد في CSS? العب', + 'ca': 'Vols aprendre CSS grid? Jugar', + 'da': 'Vil du lære CSS grid? Spil', + 'et': 'Kas sa tahad õppida CSS grid\'i? Mängi', + 'fi': 'Haluatko oppia CSS grid -asettelun? Kokeile peliä', + 'tr': 'CSS grid öğrenmek ister misiniz? Oyna', + 'az': 'CSS grid öyrənmək istəyirsiniz? Oyna', + 'gl': 'Tamén queres aprender CSS grid? Proba o', + 'uk': 'Хочеш вивчити CSS grid? Грай', + 'th': 'อยากเรียนรู้ CSS grid? เล่น', + 'mn': 'CSS grid-г сурмаар байна уу? Тоглох' + }, + labelLanguage: { + 'en': 'Language', + 'he': 'שפה', + 'bs': 'Jezik', + 'hr': 'Jezik', + 'de': 'Sprache', + 'fr': 'Langue', + 'pt-br': 'Idioma', + 'es': 'Lengua', + 'ru': 'Язык', + 'lv': 'Valoda', + 'it': 'Lingua', + 'pl': 'Język', + 'id': 'Bahasa', + 'ar': 'اللغة', + 'ca': 'Idioma', + 'te': 'భాష', + 'da': 'Sprog', + 'et': 'Keel', + 'fi': 'Kieli', + 'tr': 'Dil', + 'az': 'Dil', + 'gl': 'Idioma', + 'uk': 'Мова', + 'th': 'ภาษา', + 'mn': 'Хэл' + }, + labelSettings: { + 'en': 'Settings', + 'he': 'הגדרות', + 'bs': 'Postavke', + 'hr': 'Postavke', + 'de': 'Einstellungen', + 'fr': 'Paramètres', + 'lv': 'Iestatījumi', + 'it': 'Impostazioni', + 'pl': 'Ustawienia', + 'pt-br': 'Configurações', + 'ru': 'Настройки', + 'id': 'Pengaturan', + 'ar': 'الاعدادات', + 'ca': 'Paràmetres', + 'te': 'సెట్టింగులు', + 'da': 'Indstillinger', + 'et': 'Seaded', + 'fi': 'Asetukset', + 'tr': 'Ayarlar', + 'az': 'Parametrlər', + 'gl': 'Axustes', + 'uk': 'Налаштування', + 'th': 'การตั้งค่า', + 'mn': 'Тохиргоо' + }, + labelDifficulty: { + 'en': 'Difficulty', + 'he': 'רמת קושי', + 'bs': 'Težina', + 'hr': 'Težina', + 'de': 'Schwierigkeitsgrad', + 'fr': 'Difficulté', + 'lv': 'Grūtības pakāpe', + 'it': 'Difficoltà', + 'pl': 'Poziom trudności', + 'pt-br': 'Dificuldade', + 'ru': 'Сложность', + 'id': 'Tingkat Kesulitan', + 'ar': 'المستوى', + 'ca': 'Dificultat', + 'te': 'స్థాయి', + 'da': 'Sværhedsgrad', + 'et': 'Raskustase', + 'fi': 'Vaikeustaso', + 'tr': 'Zorluk', + 'az': 'Çətinlik', + 'gl': 'Dificultade', + 'uk': 'Складність', + 'th': 'ความยาก', + 'mn': 'Хүндрэл' + }, + labelColorblind: { + 'en': 'Colorblind Mode', + 'he': 'מצב לעיוורי צבעים', + 'bs': 'Postavke za slijepe', + 'hr': 'Postavke za slijepe', + 'de': 'Farbenblind-Modus', + 'fr': 'Mode Daltonien', + 'lv': 'Krāsu akluma režīms', + 'it': 'Modalità daltonici', + 'pl': 'Tryb dla daltonistów', + 'pt-br': 'Modo daltônico', + 'ru': 'Режим для дальтоников', + 'id': 'Mode Buta Warna', + 'ar': 'وضعية عمى الالوان', + 'ca': 'Mode per daltònics', + 'da': 'Indstilling til farveblinde', + 'et': 'Värvipimeduse režiim', + 'fi': 'Värien erottelun avustin', + 'tr': 'Renk körlüğü modu', + 'az': 'Rəng korluğu rejimi', + 'gl': 'Modo daltónico', + 'uk': 'Режим для дальтоніків', + 'th': 'โหมดตาบอดสี', + 'mn': 'Colorblind Mode' + }, + labelColorblindOff: { + 'en': 'Off', + 'he': 'כבוי', + 'bs': 'Deaktivirano', + 'hr': 'Deaktivirano', + 'de': 'Aus', + 'fr': 'Désactivé', + 'lv': 'Izslēgts', + 'pl': 'Wyłączony', + 'pt-br': 'Desligado', + 'ru': 'Выключен', + 'id': 'Matikan', + 'ar': 'ايقاف', + 'ca': 'Desactivat', + 'da': 'Fra', + 'et': 'Väljas', + 'fi': 'Poissa käytöstä', + 'tr': 'Kapalı', + 'az': 'Bağlı', + 'gl': 'Non', + 'uk': 'Вимкнено', + 'th': 'ปิด', + 'mn': 'Унтраах' + }, + labelColorblindOn: { + 'en': 'On', + 'he': 'דלוק', + 'bs': 'Aktivirano', + 'hr': 'Aktivirano', + 'de': 'An', + 'fr': 'Activé', + 'lv': 'Ieslēgts', + 'pl': 'Włączony', + 'pt-br': 'Ligado', + 'ru': 'Включён', + 'id': 'Aktifkan', + 'ar': 'تشغيل', + 'ca': 'Activat', + 'da': 'Til', + 'et': 'Sees', + 'fi': 'Käytössä', + 'tr': 'Açık', + 'az': 'Açıq', + 'gl': 'Si', + 'uk': 'Увімкнено', + 'th': 'เปิด', + 'mn': 'Асаах' + }, + labelDifficultyEasy: { + 'en': 'Beginner', + 'he': 'קל', + 'bs': 'Početnik', + 'hr': 'Početnik', + 'de': 'Anfänger', + 'fr': 'Débutant', + 'lv': 'Viegls', + 'it': 'Principiante', + 'pl': 'Łatwy', + 'pt-br': 'Iniciante', + 'ru': 'Новичок', + 'id': 'pemula', + 'ar': 'مبتدئ', + 'ca': 'Principiant', + 'te': 'బిగినర్', + 'da': 'Begynder', + 'et': 'Algaja', + 'fi': 'Helppo', + 'tr': 'Acemi', + 'az': 'Başlanğıc', + 'gl': 'Novato', + 'uk': 'Початківець', + 'th': 'มือใหม่', + 'mn': 'Амархан' + }, + labelDifficultyMedium: { + 'en': 'Intermediate - No Directions', + 'he': 'בינוני - בלי בכוונה', + 'bs': 'Srednji nivo - Bez pomaganja', + 'hr': 'Srednji nivo - Bez pomaganja', + 'de': 'Erfahren - Keine Hinweise', + 'fr': 'Intermédiaire - Pas d\'indications', + 'lv': 'Vidēji grūts - Bez norādēm', + 'it': 'Intermedio - Nessuna istruzione', + 'pl': 'Średni - Brak wskazówek', + 'pt-br': 'Intermediário - Sem instruções', + 'ru': 'Средняя — без подсказок', + 'id': 'Medium- tidak ada arahan', + 'ar': 'متوسط - بلا توجيهات', + 'ca': 'Intermig - Sense Indicacions', + 'te': 'ఇంటర్మీడియట్ - సహాయం ఉండదు', + 'da': 'Øvet - ingen hjælp', + 'et': 'Keskmine tase - puuduvad juhised', + 'fi': 'Keskitaso – ei ohjeita', + 'tr': 'Orta Düzey - Yol Tarifi Yok', + 'az': 'Orta Səviyyə - İstiqamətlər Yoxdur', + 'gl': 'Intermedio: Sen pistas', + 'uk': 'Середній - Без підказок', + 'th': 'ระดับกลาง - ไม่มีคำใบ้', + 'mn': 'Дунд - No Directions' + }, + labelDifficultyHard: { + 'en': 'Expert - No Directions & Random Levels', + 'he': 'קשה - בלי הכוונה ובשלבים רנדומלים', + 'bs': 'Expert - Bez pomoći i nasumični nivoi', + 'hr': 'Expert - Bez pomoći i nasumični nivoi', + 'de': 'Experte - Keine Hinweise & zufällige Level', + 'fr': 'Expert - Pas d\'indications & Niveaux mélangés', + 'lv': 'Ļoti grūts - Bez norādēm un līmeņi jauktā secībā', + 'it': 'Esperto - Nessuna istruzione e livelli in ordine casuale', + 'pl': 'Trudny - Brak wskazówek i losowe poziomy', + 'pt-br': 'Experiente - Sem instruções e níveis aleatórios', + 'ru': 'Эксперт — без подсказок и случайные уровни', + 'id': 'Ahli - Tidak ada arahan & Tingkat permainan Acak', + 'ar': 'متقدم - بلا توجيهات وبمراحل عشوائية', + 'ca': 'Expert - Sense indicacions i Nivells aleatòris', + 'te': 'నిపుణుడు - సహాయం లేదు మరియు భిన్నమైన గట్టలు వస్తుంది', + 'da': 'Ekspert - ingen hjælp og tilfældige niveauer', + 'et': 'Ekspert - puuduvad juhised ja tasemed on juhuslikud', + 'fi': 'Vaikea – ei ohjeita, kentät sattumanvaraisessa järjestyksessä', + 'tr': 'Uzman - Yol Tarifi Yok & Rastgele Seviyeler', + 'az': 'Ekspert - İstiqamətlər Yoxdur və Təsadüfi Səviyyələr Var ', + 'gl': 'Experto - Sen pistas e con niveis aleatorios', + 'uk': 'Експерт - Без підказок та випадкові рівні', + 'th': 'เชี่ยวชาญ - ไม่มีคำใบ้ & สุ่มเลเวล', + 'mn': 'Хэцүү - No Directions & Дурын үеүүд' + } +}; diff --git a/src/Games/Flexcode/node_modules/animate.css/.editorconfig b/src/Games/Flexcode/node_modules/animate.css/.editorconfig new file mode 100644 index 00000000..8951c392 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/.editorconfig @@ -0,0 +1,11 @@ +# editorconfig.org +root = true + +[*] +indent_style = space +indent_size = 2 +tab_width = 2 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true diff --git a/src/Games/Flexcode/node_modules/animate.css/.npmignore b/src/Games/Flexcode/node_modules/animate.css/.npmignore new file mode 100644 index 00000000..9621ab88 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/.npmignore @@ -0,0 +1,4 @@ +.sass-cache +node_modules/ +.DS_Store +test/ diff --git a/src/Games/Flexcode/node_modules/animate.css/Gruntfile.js b/src/Games/Flexcode/node_modules/animate.css/Gruntfile.js new file mode 100644 index 00000000..c0a16654 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/Gruntfile.js @@ -0,0 +1,79 @@ +module.exports = function(grunt) { + + require('load-grunt-tasks')(grunt); + + var concatAnim; + + grunt.initConfig({ + + pkg: grunt.file.readJSON('package.json'), + + concat: { + dist: { + src: [ 'source/_base.css', 'source/**/*.css' ], // _base.css required for .animated helper class + dest: 'animate.css' + } + }, + + autoprefixer: { // https://github.com/nDmitry/grunt-autoprefixer + options: { + browsers: ['last 2 versions', 'bb 10'] + }, + no_dest: { + src: 'animate.css' // output file + } + }, + + cssmin: { + minify: { + src: ['animate.css'], + dest: 'animate.min.css', + } + }, + + watch: { + css: { + files: [ 'source/**/*', 'animate-config.json' ], + tasks: ['default'] + } + } + + }); + + // fuction to perform custom task + concatAnim = function () { + + var categories = grunt.file.readJSON('animate-config.json'), + category, files, file, + target = [ 'source/_base.css' ], + count = 0; + + for ( category in categories ) { + if ( categories.hasOwnProperty(category) ) { + files = categories[category] + for (file in files) { + if ( files.hasOwnProperty(file) && files[file] ) { + target.push('source/' + category + '/' + file + '.css'); + count += 1; + } + } + } + } + + if (!count) { + grunt.log.writeln('No animations activated.'); + } else { + grunt.log.writeln(count + (count > 1 ? ' animations' : ' animation') + ' activated.'); + } + + grunt.config('concat', { 'animate.css': target }); + grunt.task.run('concat'); + + }; + + // register task + grunt.registerTask('concat-anim', 'Concatenates activated animations', concatAnim); // custom task + grunt.registerTask('default', ['concat-anim', 'autoprefixer', 'cssmin']); + grunt.registerTask('dev', ['watch']); + +}; diff --git a/src/Games/Flexcode/node_modules/animate.css/README.md b/src/Games/Flexcode/node_modules/animate.css/README.md new file mode 100644 index 00000000..250a2154 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/README.md @@ -0,0 +1,171 @@ +#Animate.css +*Just-add-water CSS animation* + +`animate.css` is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness. + +##Basic Usage +1. Include the stylesheet on your document's `` + + ```html + + + + ``` +2. Add the class `animated` to the element you want to animate. + You may also want to include the class `infinite` for an infinite loop. + +3. Finally you need to add one of the following classes: + + * `bounce` + * `flash` + * `pulse` + * `rubberBand` + * `shake` + * `swing` + * `tada` + * `wobble` + * `jello` + * `bounceIn` + * `bounceInDown` + * `bounceInLeft` + * `bounceInRight` + * `bounceInUp` + * `bounceOut` + * `bounceOutDown` + * `bounceOutLeft` + * `bounceOutRight` + * `bounceOutUp` + * `fadeIn` + * `fadeInDown` + * `fadeInDownBig` + * `fadeInLeft` + * `fadeInLeftBig` + * `fadeInRight` + * `fadeInRightBig` + * `fadeInUp` + * `fadeInUpBig` + * `fadeOut` + * `fadeOutDown` + * `fadeOutDownBig` + * `fadeOutLeft` + * `fadeOutLeftBig` + * `fadeOutRight` + * `fadeOutRightBig` + * `fadeOutUp` + * `fadeOutUpBig` + * `flipInX` + * `flipInY` + * `flipOutX` + * `flipOutY` + * `lightSpeedIn` + * `lightSpeedOut` + * `rotateIn` + * `rotateInDownLeft` + * `rotateInDownRight` + * `rotateInUpLeft` + * `rotateInUpRight` + * `rotateOut` + * `rotateOutDownLeft` + * `rotateOutDownRight` + * `rotateOutUpLeft` + * `rotateOutUpRight` + * `hinge` + * `rollIn` + * `rollOut` + * `zoomIn` + * `zoomInDown` + * `zoomInLeft` + * `zoomInRight` + * `zoomInUp` + * `zoomOut` + * `zoomOutDown` + * `zoomOutLeft` + * `zoomOutRight` + * `zoomOutUp` + * `slideInDown` + * `slideInLeft` + * `slideInRight` + * `slideInUp` + * `slideOutDown` + * `slideOutLeft` + * `slideOutRight` + * `slideOutUp` + +Full example: +```html +

                Example

                +``` + +[Check out all the animations here!](https://daneden.github.io/animate.css/) + +##Usage +To use animate.css in your website, simply drop the stylesheet into your document's ``, and add the class `animated` to an element, along with any of the animation names. That's it! You've got a CSS animated element. Super! + +```html + + + +``` + +You can do a whole bunch of other stuff with animate.css when you combine it with jQuery or add your own CSS rules. Dynamically add animations using jQuery with ease: + +```javascript +$('#yourElement').addClass('animated bounceOutLeft'); +``` + +You can also detect when an animation ends: + + + +```javascript +$('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', doSomething); +``` + +[View a video tutorial](https://www.youtube.com/watch?v=CBQGl6zokMs) on how to use Animate.css with jQuery here. + +**Note:** `jQuery.one()` is used when you want to execute the event handler at most *once*. More information [here](http://api.jquery.com/one/). + +You can change the duration of your animations, add a delay or change the number of times that it plays: + +```css +#yourElement { + -vendor-animation-duration: 3s; + -vendor-animation-delay: 2s; + -vendor-animation-iteration-count: infinite; +} +``` + +*Note: be sure to replace "vendor" in the CSS with the applicable vendor prefixes (webkit, moz, etc)* + +## Custom Builds +Animate.css is powered by [Grunt](http://gruntjs.com), and you can create custom builds pretty easily. First of all, you’ll need Grunt and all other dependencies: + +```sh +$ cd path/to/animate.css/ +$ sudo npm install +``` + +Next, run `grunt watch` to watch for changes and compile your custom builds. For example, if you want only some of the the “attention seekers”, simply edit the `animate-config.json` file to select only the animations you want to use. + +```javascript +"attention_seekers": { + "bounce": true, + "flash": false, + "pulse": false, + "shake": true, + "swing": true, + "tada": true, + "wobble": true, + "jello":true +} +``` + +## License +Animate.css is licensed under the MIT license. (http://opensource.org/licenses/MIT) + +## Contributing +Pull requests are the way to go here. I apologise in advance for the slow action on pull requests and issues. I only have two rules for submitting a pull request: match the naming convention (camelCase, categorised [fades, bounces, etc]) and let us see a demo of submitted animations in a [pen](http://codepen.io). That last one is important. diff --git a/src/Games/Flexcode/node_modules/animate.css/animate-config.json b/src/Games/Flexcode/node_modules/animate.css/animate-config.json new file mode 100644 index 00000000..28c7fad6 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/animate-config.json @@ -0,0 +1,119 @@ +{ + + "attention_seekers": { + "bounce": true, + "flash": true, + "pulse": true, + "rubberBand": true, + "shake": true, + "swing": true, + "tada": true, + "wobble": true, + "jello": true + }, + + "bouncing_entrances": { + "bounceIn": true, + "bounceInDown": true, + "bounceInLeft": true, + "bounceInRight": true, + "bounceInUp": true + }, + + "bouncing_exits": { + "bounceOut": true, + "bounceOutDown": true, + "bounceOutLeft": true, + "bounceOutRight": true, + "bounceOutUp": true + }, + + "fading_entrances": { + "fadeIn": true, + "fadeInDown": true, + "fadeInDownBig": true, + "fadeInLeft": true, + "fadeInLeftBig": true, + "fadeInRight": true, + "fadeInRightBig": true, + "fadeInUp": true, + "fadeInUpBig": true + }, + + "fading_exits": { + "fadeOut": true, + "fadeOutDown": true, + "fadeOutDownBig": true, + "fadeOutLeft": true, + "fadeOutLeftBig": true, + "fadeOutRight": true, + "fadeOutRightBig": true, + "fadeOutUp": true, + "fadeOutUpBig": true + }, + + "flippers": { + "flip": true, + "flipInX": true, + "flipInY": true, + "flipOutX": true, + "flipOutY": true + }, + + "lightspeed": { + "lightSpeedIn": true, + "lightSpeedOut": true + }, + + "rotating_entrances": { + "rotateIn": true, + "rotateInDownLeft": true, + "rotateInDownRight": true, + "rotateInUpLeft": true, + "rotateInUpRight": true + }, + + "rotating_exits": { + "rotateOut": true, + "rotateOutDownLeft": true, + "rotateOutDownRight": true, + "rotateOutUpLeft": true, + "rotateOutUpRight": true + }, + + "specials": { + "hinge": true, + "rollIn": true, + "rollOut": true + }, + + "zooming_entrances": { + "zoomIn": true, + "zoomInDown": true, + "zoomInLeft": true, + "zoomInRight": true, + "zoomInUp": true + }, + + "zooming_exits": { + "zoomOut": true, + "zoomOutDown": true, + "zoomOutLeft": true, + "zoomOutRight": true, + "zoomOutUp": true + }, + + "sliding_entrances": { + "slideInDown": true, + "slideInLeft": true, + "slideInRight": true, + "slideInUp": true + }, + + "sliding_exits": { + "slideOutDown": true, + "slideOutLeft": true, + "slideOutRight": true, + "slideOutUp": true + } +} diff --git a/src/Games/Flexcode/node_modules/animate.css/animate.css b/src/Games/Flexcode/node_modules/animate.css/animate.css new file mode 100644 index 00000000..54fa40e1 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/animate.css @@ -0,0 +1,3272 @@ +@charset "UTF-8"; + +/*! +Animate.css - http://daneden.me/animate +Licensed under the MIT license - http://opensource.org/licenses/MIT + +Copyright (c) 2015 Daniel Eden +*/ + +.animated { + -webkit-animation-duration: 1s; + animation-duration: 1s; + -webkit-animation-fill-mode: both; + animation-fill-mode: both; +} + +.animated.infinite { + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; +} + +.animated.hinge { + -webkit-animation-duration: 2s; + animation-duration: 2s; +} + +.animated.bounceIn, +.animated.bounceOut { + -webkit-animation-duration: .75s; + animation-duration: .75s; +} + +.animated.flipOutX, +.animated.flipOutY { + -webkit-animation-duration: .75s; + animation-duration: .75s; +} + +@-webkit-keyframes bounce { + from, 20%, 53%, 80%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + -webkit-transform: translate3d(0,0,0); + transform: translate3d(0,0,0); + } + + 40%, 43% { + -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + -webkit-transform: translate3d(0, -30px, 0); + transform: translate3d(0, -30px, 0); + } + + 70% { + -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + -webkit-transform: translate3d(0, -15px, 0); + transform: translate3d(0, -15px, 0); + } + + 90% { + -webkit-transform: translate3d(0,-4px,0); + transform: translate3d(0,-4px,0); + } +} + +@keyframes bounce { + from, 20%, 53%, 80%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + -webkit-transform: translate3d(0,0,0); + transform: translate3d(0,0,0); + } + + 40%, 43% { + -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + -webkit-transform: translate3d(0, -30px, 0); + transform: translate3d(0, -30px, 0); + } + + 70% { + -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + -webkit-transform: translate3d(0, -15px, 0); + transform: translate3d(0, -15px, 0); + } + + 90% { + -webkit-transform: translate3d(0,-4px,0); + transform: translate3d(0,-4px,0); + } +} + +.bounce { + -webkit-animation-name: bounce; + animation-name: bounce; + -webkit-transform-origin: center bottom; + transform-origin: center bottom; +} + +@-webkit-keyframes flash { + from, 50%, 100% { + opacity: 1; + } + + 25%, 75% { + opacity: 0; + } +} + +@keyframes flash { + from, 50%, 100% { + opacity: 1; + } + + 25%, 75% { + opacity: 0; + } +} + +.flash { + -webkit-animation-name: flash; + animation-name: flash; +} + +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@-webkit-keyframes pulse { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 50% { + -webkit-transform: scale3d(1.05, 1.05, 1.05); + transform: scale3d(1.05, 1.05, 1.05); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +@keyframes pulse { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 50% { + -webkit-transform: scale3d(1.05, 1.05, 1.05); + transform: scale3d(1.05, 1.05, 1.05); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +.pulse { + -webkit-animation-name: pulse; + animation-name: pulse; +} + +@-webkit-keyframes rubberBand { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 30% { + -webkit-transform: scale3d(1.25, 0.75, 1); + transform: scale3d(1.25, 0.75, 1); + } + + 40% { + -webkit-transform: scale3d(0.75, 1.25, 1); + transform: scale3d(0.75, 1.25, 1); + } + + 50% { + -webkit-transform: scale3d(1.15, 0.85, 1); + transform: scale3d(1.15, 0.85, 1); + } + + 65% { + -webkit-transform: scale3d(.95, 1.05, 1); + transform: scale3d(.95, 1.05, 1); + } + + 75% { + -webkit-transform: scale3d(1.05, .95, 1); + transform: scale3d(1.05, .95, 1); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +@keyframes rubberBand { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 30% { + -webkit-transform: scale3d(1.25, 0.75, 1); + transform: scale3d(1.25, 0.75, 1); + } + + 40% { + -webkit-transform: scale3d(0.75, 1.25, 1); + transform: scale3d(0.75, 1.25, 1); + } + + 50% { + -webkit-transform: scale3d(1.15, 0.85, 1); + transform: scale3d(1.15, 0.85, 1); + } + + 65% { + -webkit-transform: scale3d(.95, 1.05, 1); + transform: scale3d(.95, 1.05, 1); + } + + 75% { + -webkit-transform: scale3d(1.05, .95, 1); + transform: scale3d(1.05, .95, 1); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +.rubberBand { + -webkit-animation-name: rubberBand; + animation-name: rubberBand; +} + +@-webkit-keyframes shake { + from, 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 10%, 30%, 50%, 70%, 90% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0); + } + + 20%, 40%, 60%, 80% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0); + } +} + +@keyframes shake { + from, 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 10%, 30%, 50%, 70%, 90% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0); + } + + 20%, 40%, 60%, 80% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0); + } +} + +.shake { + -webkit-animation-name: shake; + animation-name: shake; +} + +@-webkit-keyframes swing { + 20% { + -webkit-transform: rotate3d(0, 0, 1, 15deg); + transform: rotate3d(0, 0, 1, 15deg); + } + + 40% { + -webkit-transform: rotate3d(0, 0, 1, -10deg); + transform: rotate3d(0, 0, 1, -10deg); + } + + 60% { + -webkit-transform: rotate3d(0, 0, 1, 5deg); + transform: rotate3d(0, 0, 1, 5deg); + } + + 80% { + -webkit-transform: rotate3d(0, 0, 1, -5deg); + transform: rotate3d(0, 0, 1, -5deg); + } + + 100% { + -webkit-transform: rotate3d(0, 0, 1, 0deg); + transform: rotate3d(0, 0, 1, 0deg); + } +} + +@keyframes swing { + 20% { + -webkit-transform: rotate3d(0, 0, 1, 15deg); + transform: rotate3d(0, 0, 1, 15deg); + } + + 40% { + -webkit-transform: rotate3d(0, 0, 1, -10deg); + transform: rotate3d(0, 0, 1, -10deg); + } + + 60% { + -webkit-transform: rotate3d(0, 0, 1, 5deg); + transform: rotate3d(0, 0, 1, 5deg); + } + + 80% { + -webkit-transform: rotate3d(0, 0, 1, -5deg); + transform: rotate3d(0, 0, 1, -5deg); + } + + 100% { + -webkit-transform: rotate3d(0, 0, 1, 0deg); + transform: rotate3d(0, 0, 1, 0deg); + } +} + +.swing { + -webkit-transform-origin: top center; + transform-origin: top center; + -webkit-animation-name: swing; + animation-name: swing; +} + +@-webkit-keyframes tada { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 10%, 20% { + -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); + transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); + } + + 30%, 50%, 70%, 90% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); + } + + 40%, 60%, 80% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +@keyframes tada { + from { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } + + 10%, 20% { + -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); + transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); + } + + 30%, 50%, 70%, 90% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); + } + + 40%, 60%, 80% { + -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); + } + + 100% { + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +.tada { + -webkit-animation-name: tada; + animation-name: tada; +} + +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@-webkit-keyframes wobble { + from { + -webkit-transform: none; + transform: none; + } + + 15% { + -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); + transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); + } + + 30% { + -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); + transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); + } + + 45% { + -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); + transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); + } + + 60% { + -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); + transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); + } + + 75% { + -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); + transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +@keyframes wobble { + from { + -webkit-transform: none; + transform: none; + } + + 15% { + -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); + transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); + } + + 30% { + -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); + transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); + } + + 45% { + -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); + transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); + } + + 60% { + -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); + transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); + } + + 75% { + -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); + transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +.wobble { + -webkit-animation-name: wobble; + animation-name: wobble; +} + +@-webkit-keyframes jello { + from, 11.1%, 100% { + -webkit-transform: none; + transform: none; + } + + 22.2% { + -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); + transform: skewX(-12.5deg) skewY(-12.5deg); + } + + 33.3% { + -webkit-transform: skewX(6.25deg) skewY(6.25deg); + transform: skewX(6.25deg) skewY(6.25deg); + } + + 44.4% { + -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); + transform: skewX(-3.125deg) skewY(-3.125deg); + } + + 55.5% { + -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); + transform: skewX(1.5625deg) skewY(1.5625deg); + } + + 66.6% { + -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); + transform: skewX(-0.78125deg) skewY(-0.78125deg); + } + + 77.7% { + -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); + transform: skewX(0.390625deg) skewY(0.390625deg); + } + + 88.8% { + -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); + transform: skewX(-0.1953125deg) skewY(-0.1953125deg); + } +} + +@keyframes jello { + from, 11.1%, 100% { + -webkit-transform: none; + transform: none; + } + + 22.2% { + -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); + transform: skewX(-12.5deg) skewY(-12.5deg); + } + + 33.3% { + -webkit-transform: skewX(6.25deg) skewY(6.25deg); + transform: skewX(6.25deg) skewY(6.25deg); + } + + 44.4% { + -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); + transform: skewX(-3.125deg) skewY(-3.125deg); + } + + 55.5% { + -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); + transform: skewX(1.5625deg) skewY(1.5625deg); + } + + 66.6% { + -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); + transform: skewX(-0.78125deg) skewY(-0.78125deg); + } + + 77.7% { + -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); + transform: skewX(0.390625deg) skewY(0.390625deg); + } + + 88.8% { + -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); + transform: skewX(-0.1953125deg) skewY(-0.1953125deg); + } +} + +.jello { + -webkit-animation-name: jello; + animation-name: jello; + -webkit-transform-origin: center; + transform-origin: center; +} + +@-webkit-keyframes bounceIn { + from, 20%, 40%, 60%, 80%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 20% { + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1); + } + + 40% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(1.03, 1.03, 1.03); + transform: scale3d(1.03, 1.03, 1.03); + } + + 80% { + -webkit-transform: scale3d(.97, .97, .97); + transform: scale3d(.97, .97, .97); + } + + 100% { + opacity: 1; + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +@keyframes bounceIn { + from, 20%, 40%, 60%, 80%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 20% { + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1); + } + + 40% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(1.03, 1.03, 1.03); + transform: scale3d(1.03, 1.03, 1.03); + } + + 80% { + -webkit-transform: scale3d(.97, .97, .97); + transform: scale3d(.97, .97, .97); + } + + 100% { + opacity: 1; + -webkit-transform: scale3d(1, 1, 1); + transform: scale3d(1, 1, 1); + } +} + +.bounceIn { + -webkit-animation-name: bounceIn; + animation-name: bounceIn; +} + +@-webkit-keyframes bounceInDown { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -3000px, 0); + transform: translate3d(0, -3000px, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, 25px, 0); + transform: translate3d(0, 25px, 0); + } + + 75% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0); + } + + 90% { + -webkit-transform: translate3d(0, 5px, 0); + transform: translate3d(0, 5px, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +@keyframes bounceInDown { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(0, -3000px, 0); + transform: translate3d(0, -3000px, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, 25px, 0); + transform: translate3d(0, 25px, 0); + } + + 75% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0); + } + + 90% { + -webkit-transform: translate3d(0, 5px, 0); + transform: translate3d(0, 5px, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +.bounceInDown { + -webkit-animation-name: bounceInDown; + animation-name: bounceInDown; +} + +@-webkit-keyframes bounceInLeft { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(-3000px, 0, 0); + transform: translate3d(-3000px, 0, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(25px, 0, 0); + transform: translate3d(25px, 0, 0); + } + + 75% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0); + } + + 90% { + -webkit-transform: translate3d(5px, 0, 0); + transform: translate3d(5px, 0, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +@keyframes bounceInLeft { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + -webkit-transform: translate3d(-3000px, 0, 0); + transform: translate3d(-3000px, 0, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(25px, 0, 0); + transform: translate3d(25px, 0, 0); + } + + 75% { + -webkit-transform: translate3d(-10px, 0, 0); + transform: translate3d(-10px, 0, 0); + } + + 90% { + -webkit-transform: translate3d(5px, 0, 0); + transform: translate3d(5px, 0, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +.bounceInLeft { + -webkit-animation-name: bounceInLeft; + animation-name: bounceInLeft; +} + +@-webkit-keyframes bounceInRight { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + -webkit-transform: translate3d(3000px, 0, 0); + transform: translate3d(3000px, 0, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(-25px, 0, 0); + transform: translate3d(-25px, 0, 0); + } + + 75% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0); + } + + 90% { + -webkit-transform: translate3d(-5px, 0, 0); + transform: translate3d(-5px, 0, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +@keyframes bounceInRight { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + -webkit-transform: translate3d(3000px, 0, 0); + transform: translate3d(3000px, 0, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(-25px, 0, 0); + transform: translate3d(-25px, 0, 0); + } + + 75% { + -webkit-transform: translate3d(10px, 0, 0); + transform: translate3d(10px, 0, 0); + } + + 90% { + -webkit-transform: translate3d(-5px, 0, 0); + transform: translate3d(-5px, 0, 0); + } + + 100% { + -webkit-transform: none; + transform: none; + } +} + +.bounceInRight { + -webkit-animation-name: bounceInRight; + animation-name: bounceInRight; +} + +@-webkit-keyframes bounceInUp { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + -webkit-transform: translate3d(0, 3000px, 0); + transform: translate3d(0, 3000px, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + + 75% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0); + } + + 90% { + -webkit-transform: translate3d(0, -5px, 0); + transform: translate3d(0, -5px, 0); + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +@keyframes bounceInUp { + from, 60%, 75%, 90%, 100% { + -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + -webkit-transform: translate3d(0, 3000px, 0); + transform: translate3d(0, 3000px, 0); + } + + 60% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + + 75% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0); + } + + 90% { + -webkit-transform: translate3d(0, -5px, 0); + transform: translate3d(0, -5px, 0); + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +.bounceInUp { + -webkit-animation-name: bounceInUp; + animation-name: bounceInUp; +} + +@-webkit-keyframes bounceOut { + 20% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9); + } + + 50%, 55% { + opacity: 1; + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } +} + +@keyframes bounceOut { + 20% { + -webkit-transform: scale3d(.9, .9, .9); + transform: scale3d(.9, .9, .9); + } + + 50%, 55% { + opacity: 1; + -webkit-transform: scale3d(1.1, 1.1, 1.1); + transform: scale3d(1.1, 1.1, 1.1); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } +} + +.bounceOut { + -webkit-animation-name: bounceOut; + animation-name: bounceOut; +} + +@-webkit-keyframes bounceOutDown { + 20% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0); + } + + 40%, 45% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } +} + +@keyframes bounceOutDown { + 20% { + -webkit-transform: translate3d(0, 10px, 0); + transform: translate3d(0, 10px, 0); + } + + 40%, 45% { + opacity: 1; + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } +} + +.bounceOutDown { + -webkit-animation-name: bounceOutDown; + animation-name: bounceOutDown; +} + +@-webkit-keyframes bounceOutLeft { + 20% { + opacity: 1; + -webkit-transform: translate3d(20px, 0, 0); + transform: translate3d(20px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } +} + +@keyframes bounceOutLeft { + 20% { + opacity: 1; + -webkit-transform: translate3d(20px, 0, 0); + transform: translate3d(20px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } +} + +.bounceOutLeft { + -webkit-animation-name: bounceOutLeft; + animation-name: bounceOutLeft; +} + +@-webkit-keyframes bounceOutRight { + 20% { + opacity: 1; + -webkit-transform: translate3d(-20px, 0, 0); + transform: translate3d(-20px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } +} + +@keyframes bounceOutRight { + 20% { + opacity: 1; + -webkit-transform: translate3d(-20px, 0, 0); + transform: translate3d(-20px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } +} + +.bounceOutRight { + -webkit-animation-name: bounceOutRight; + animation-name: bounceOutRight; +} + +@-webkit-keyframes bounceOutUp { + 20% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0); + } + + 40%, 45% { + opacity: 1; + -webkit-transform: translate3d(0, 20px, 0); + transform: translate3d(0, 20px, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } +} + +@keyframes bounceOutUp { + 20% { + -webkit-transform: translate3d(0, -10px, 0); + transform: translate3d(0, -10px, 0); + } + + 40%, 45% { + opacity: 1; + -webkit-transform: translate3d(0, 20px, 0); + transform: translate3d(0, 20px, 0); + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } +} + +.bounceOutUp { + -webkit-animation-name: bounceOutUp; + animation-name: bounceOutUp; +} + +@-webkit-keyframes fadeIn { + from { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +@keyframes fadeIn { + from { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +.fadeIn { + -webkit-animation-name: fadeIn; + animation-name: fadeIn; +} + +@-webkit-keyframes fadeInDown { + from { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInDown { + from { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInDown { + -webkit-animation-name: fadeInDown; + animation-name: fadeInDown; +} + +@-webkit-keyframes fadeInDownBig { + from { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInDownBig { + from { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInDownBig { + -webkit-animation-name: fadeInDownBig; + animation-name: fadeInDownBig; +} + +@-webkit-keyframes fadeInLeft { + from { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInLeft { + from { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInLeft { + -webkit-animation-name: fadeInLeft; + animation-name: fadeInLeft; +} + +@-webkit-keyframes fadeInLeftBig { + from { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInLeftBig { + from { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInLeftBig { + -webkit-animation-name: fadeInLeftBig; + animation-name: fadeInLeftBig; +} + +@-webkit-keyframes fadeInRight { + from { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInRight { + from { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInRight { + -webkit-animation-name: fadeInRight; + animation-name: fadeInRight; +} + +@-webkit-keyframes fadeInRightBig { + from { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInRightBig { + from { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInRightBig { + -webkit-animation-name: fadeInRightBig; + animation-name: fadeInRightBig; +} + +@-webkit-keyframes fadeInUp { + from { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInUp { + from { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInUp { + -webkit-animation-name: fadeInUp; + animation-name: fadeInUp; +} + +@-webkit-keyframes fadeInUpBig { + from { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes fadeInUpBig { + from { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.fadeInUpBig { + -webkit-animation-name: fadeInUpBig; + animation-name: fadeInUpBig; +} + +@-webkit-keyframes fadeOut { + from { + opacity: 1; + } + + 100% { + opacity: 0; + } +} + +@keyframes fadeOut { + from { + opacity: 1; + } + + 100% { + opacity: 0; + } +} + +.fadeOut { + -webkit-animation-name: fadeOut; + animation-name: fadeOut; +} + +@-webkit-keyframes fadeOutDown { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } +} + +@keyframes fadeOutDown { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } +} + +.fadeOutDown { + -webkit-animation-name: fadeOutDown; + animation-name: fadeOutDown; +} + +@-webkit-keyframes fadeOutDownBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } +} + +@keyframes fadeOutDownBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, 2000px, 0); + transform: translate3d(0, 2000px, 0); + } +} + +.fadeOutDownBig { + -webkit-animation-name: fadeOutDownBig; + animation-name: fadeOutDownBig; +} + +@-webkit-keyframes fadeOutLeft { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } +} + +@keyframes fadeOutLeft { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } +} + +.fadeOutLeft { + -webkit-animation-name: fadeOutLeft; + animation-name: fadeOutLeft; +} + +@-webkit-keyframes fadeOutLeftBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } +} + +@keyframes fadeOutLeftBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(-2000px, 0, 0); + transform: translate3d(-2000px, 0, 0); + } +} + +.fadeOutLeftBig { + -webkit-animation-name: fadeOutLeftBig; + animation-name: fadeOutLeftBig; +} + +@-webkit-keyframes fadeOutRight { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } +} + +@keyframes fadeOutRight { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } +} + +.fadeOutRight { + -webkit-animation-name: fadeOutRight; + animation-name: fadeOutRight; +} + +@-webkit-keyframes fadeOutRightBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } +} + +@keyframes fadeOutRightBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(2000px, 0, 0); + transform: translate3d(2000px, 0, 0); + } +} + +.fadeOutRightBig { + -webkit-animation-name: fadeOutRightBig; + animation-name: fadeOutRightBig; +} + +@-webkit-keyframes fadeOutUp { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } +} + +@keyframes fadeOutUp { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } +} + +.fadeOutUp { + -webkit-animation-name: fadeOutUp; + animation-name: fadeOutUp; +} + +@-webkit-keyframes fadeOutUpBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } +} + +@keyframes fadeOutUpBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(0, -2000px, 0); + transform: translate3d(0, -2000px, 0); + } +} + +.fadeOutUpBig { + -webkit-animation-name: fadeOutUpBig; + animation-name: fadeOutUpBig; +} + +@-webkit-keyframes flip { + from { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); + transform: perspective(400px) rotate3d(0, 1, 0, -360deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; + } + + 40% { + -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; + } + + 50% { + -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 80% { + -webkit-transform: perspective(400px) scale3d(.95, .95, .95); + transform: perspective(400px) scale3d(.95, .95, .95); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } +} + +@keyframes flip { + from { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); + transform: perspective(400px) rotate3d(0, 1, 0, -360deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; + } + + 40% { + -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; + } + + 50% { + -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 80% { + -webkit-transform: perspective(400px) scale3d(.95, .95, .95); + transform: perspective(400px) scale3d(.95, .95, .95); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } +} + +.animated.flip { + -webkit-backface-visibility: visible; + backface-visibility: visible; + -webkit-animation-name: flip; + animation-name: flip; +} + +@-webkit-keyframes flipInX { + from { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 60% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); + transform: perspective(400px) rotate3d(1, 0, 0, 10deg); + opacity: 1; + } + + 80% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); + transform: perspective(400px) rotate3d(1, 0, 0, -5deg); + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } +} + +@keyframes flipInX { + from { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 60% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); + transform: perspective(400px) rotate3d(1, 0, 0, 10deg); + opacity: 1; + } + + 80% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); + transform: perspective(400px) rotate3d(1, 0, 0, -5deg); + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } +} + +.flipInX { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipInX; + animation-name: flipInX; +} + +@-webkit-keyframes flipInY { + from { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); + transform: perspective(400px) rotate3d(0, 1, 0, -20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 60% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); + transform: perspective(400px) rotate3d(0, 1, 0, 10deg); + opacity: 1; + } + + 80% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); + transform: perspective(400px) rotate3d(0, 1, 0, -5deg); + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } +} + +@keyframes flipInY { + from { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); + transform: perspective(400px) rotate3d(0, 1, 0, -20deg); + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; + } + + 60% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); + transform: perspective(400px) rotate3d(0, 1, 0, 10deg); + opacity: 1; + } + + 80% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); + transform: perspective(400px) rotate3d(0, 1, 0, -5deg); + } + + 100% { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } +} + +.flipInY { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipInY; + animation-name: flipInY; +} + +@-webkit-keyframes flipOutX { + from { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } + + 30% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + opacity: 1; + } + + 100% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + opacity: 0; + } +} + +@keyframes flipOutX { + from { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } + + 30% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + opacity: 1; + } + + 100% { + -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + opacity: 0; + } +} + +.flipOutX { + -webkit-animation-name: flipOutX; + animation-name: flipOutX; + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; +} + +@-webkit-keyframes flipOutY { + from { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } + + 30% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); + transform: perspective(400px) rotate3d(0, 1, 0, -15deg); + opacity: 1; + } + + 100% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + opacity: 0; + } +} + +@keyframes flipOutY { + from { + -webkit-transform: perspective(400px); + transform: perspective(400px); + } + + 30% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); + transform: perspective(400px) rotate3d(0, 1, 0, -15deg); + opacity: 1; + } + + 100% { + -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + opacity: 0; + } +} + +.flipOutY { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; + -webkit-animation-name: flipOutY; + animation-name: flipOutY; +} + +@-webkit-keyframes lightSpeedIn { + from { + -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); + transform: translate3d(100%, 0, 0) skewX(-30deg); + opacity: 0; + } + + 60% { + -webkit-transform: skewX(20deg); + transform: skewX(20deg); + opacity: 1; + } + + 80% { + -webkit-transform: skewX(-5deg); + transform: skewX(-5deg); + opacity: 1; + } + + 100% { + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes lightSpeedIn { + from { + -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); + transform: translate3d(100%, 0, 0) skewX(-30deg); + opacity: 0; + } + + 60% { + -webkit-transform: skewX(20deg); + transform: skewX(20deg); + opacity: 1; + } + + 80% { + -webkit-transform: skewX(-5deg); + transform: skewX(-5deg); + opacity: 1; + } + + 100% { + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.lightSpeedIn { + -webkit-animation-name: lightSpeedIn; + animation-name: lightSpeedIn; + -webkit-animation-timing-function: ease-out; + animation-timing-function: ease-out; +} + +@-webkit-keyframes lightSpeedOut { + from { + opacity: 1; + } + + 100% { + -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); + transform: translate3d(100%, 0, 0) skewX(30deg); + opacity: 0; + } +} + +@keyframes lightSpeedOut { + from { + opacity: 1; + } + + 100% { + -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); + transform: translate3d(100%, 0, 0) skewX(30deg); + opacity: 0; + } +} + +.lightSpeedOut { + -webkit-animation-name: lightSpeedOut; + animation-name: lightSpeedOut; + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; +} + +@-webkit-keyframes rotateIn { + from { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: rotate3d(0, 0, 1, -200deg); + transform: rotate3d(0, 0, 1, -200deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes rotateIn { + from { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: rotate3d(0, 0, 1, -200deg); + transform: rotate3d(0, 0, 1, -200deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.rotateIn { + -webkit-animation-name: rotateIn; + animation-name: rotateIn; +} + +@-webkit-keyframes rotateInDownLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes rotateInDownLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.rotateInDownLeft { + -webkit-animation-name: rotateInDownLeft; + animation-name: rotateInDownLeft; +} + +@-webkit-keyframes rotateInDownRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes rotateInDownRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.rotateInDownRight { + -webkit-animation-name: rotateInDownRight; + animation-name: rotateInDownRight; +} + +@-webkit-keyframes rotateInUpLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes rotateInUpLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.rotateInUpLeft { + -webkit-animation-name: rotateInUpLeft; + animation-name: rotateInUpLeft; +} + +@-webkit-keyframes rotateInUpRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, -90deg); + transform: rotate3d(0, 0, 1, -90deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +@keyframes rotateInUpRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, -90deg); + transform: rotate3d(0, 0, 1, -90deg); + opacity: 0; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: none; + transform: none; + opacity: 1; + } +} + +.rotateInUpRight { + -webkit-animation-name: rotateInUpRight; + animation-name: rotateInUpRight; +} + +@-webkit-keyframes rotateOut { + from { + -webkit-transform-origin: center; + transform-origin: center; + opacity: 1; + } + + 100% { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: rotate3d(0, 0, 1, 200deg); + transform: rotate3d(0, 0, 1, 200deg); + opacity: 0; + } +} + +@keyframes rotateOut { + from { + -webkit-transform-origin: center; + transform-origin: center; + opacity: 1; + } + + 100% { + -webkit-transform-origin: center; + transform-origin: center; + -webkit-transform: rotate3d(0, 0, 1, 200deg); + transform: rotate3d(0, 0, 1, 200deg); + opacity: 0; + } +} + +.rotateOut { + -webkit-animation-name: rotateOut; + animation-name: rotateOut; +} + +@-webkit-keyframes rotateOutDownLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } +} + +@keyframes rotateOutDownLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, 45deg); + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } +} + +.rotateOutDownLeft { + -webkit-animation-name: rotateOutDownLeft; + animation-name: rotateOutDownLeft; +} + +@-webkit-keyframes rotateOutDownRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +@keyframes rotateOutDownRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +.rotateOutDownRight { + -webkit-animation-name: rotateOutDownRight; + animation-name: rotateOutDownRight; +} + +@-webkit-keyframes rotateOutUpLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +@keyframes rotateOutUpLeft { + from { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: left bottom; + transform-origin: left bottom; + -webkit-transform: rotate3d(0, 0, 1, -45deg); + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +.rotateOutUpLeft { + -webkit-animation-name: rotateOutUpLeft; + animation-name: rotateOutUpLeft; +} + +@-webkit-keyframes rotateOutUpRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, 90deg); + transform: rotate3d(0, 0, 1, 90deg); + opacity: 0; + } +} + +@keyframes rotateOutUpRight { + from { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + opacity: 1; + } + + 100% { + -webkit-transform-origin: right bottom; + transform-origin: right bottom; + -webkit-transform: rotate3d(0, 0, 1, 90deg); + transform: rotate3d(0, 0, 1, 90deg); + opacity: 0; + } +} + +.rotateOutUpRight { + -webkit-animation-name: rotateOutUpRight; + animation-name: rotateOutUpRight; +} + +@-webkit-keyframes hinge { + 0% { + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + } + + 20%, 60% { + -webkit-transform: rotate3d(0, 0, 1, 80deg); + transform: rotate3d(0, 0, 1, 80deg); + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + } + + 40%, 80% { + -webkit-transform: rotate3d(0, 0, 1, 60deg); + transform: rotate3d(0, 0, 1, 60deg); + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + opacity: 1; + } + + 100% { + -webkit-transform: translate3d(0, 700px, 0); + transform: translate3d(0, 700px, 0); + opacity: 0; + } +} + +@keyframes hinge { + 0% { + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + } + + 20%, 60% { + -webkit-transform: rotate3d(0, 0, 1, 80deg); + transform: rotate3d(0, 0, 1, 80deg); + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + } + + 40%, 80% { + -webkit-transform: rotate3d(0, 0, 1, 60deg); + transform: rotate3d(0, 0, 1, 60deg); + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + opacity: 1; + } + + 100% { + -webkit-transform: translate3d(0, 700px, 0); + transform: translate3d(0, 700px, 0); + opacity: 0; + } +} + +.hinge { + -webkit-animation-name: hinge; + animation-name: hinge; +} + +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@-webkit-keyframes rollIn { + from { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); + transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +@keyframes rollIn { + from { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); + transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); + } + + 100% { + opacity: 1; + -webkit-transform: none; + transform: none; + } +} + +.rollIn { + -webkit-animation-name: rollIn; + animation-name: rollIn; +} + +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@-webkit-keyframes rollOut { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); + transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); + } +} + +@keyframes rollOut { + from { + opacity: 1; + } + + 100% { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); + transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); + } +} + +.rollOut { + -webkit-animation-name: rollOut; + animation-name: rollOut; +} + +@-webkit-keyframes zoomIn { + from { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 50% { + opacity: 1; + } +} + +@keyframes zoomIn { + from { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 50% { + opacity: 1; + } +} + +.zoomIn { + -webkit-animation-name: zoomIn; + animation-name: zoomIn; +} + +@-webkit-keyframes zoomInDown { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomInDown { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInDown { + -webkit-animation-name: zoomInDown; + animation-name: zoomInDown; +} + +@-webkit-keyframes zoomInLeft { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomInLeft { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInLeft { + -webkit-animation-name: zoomInLeft; + animation-name: zoomInLeft; +} + +@-webkit-keyframes zoomInRight { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomInRight { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInRight { + -webkit-animation-name: zoomInRight; + animation-name: zoomInRight; +} + +@-webkit-keyframes zoomInUp { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomInUp { + from { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInUp { + -webkit-animation-name: zoomInUp; + animation-name: zoomInUp; +} + +@-webkit-keyframes zoomOut { + from { + opacity: 1; + } + + 50% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 100% { + opacity: 0; + } +} + +@keyframes zoomOut { + from { + opacity: 1; + } + + 50% { + opacity: 0; + -webkit-transform: scale3d(.3, .3, .3); + transform: scale3d(.3, .3, .3); + } + + 100% { + opacity: 0; + } +} + +.zoomOut { + -webkit-animation-name: zoomOut; + animation-name: zoomOut; +} + +@-webkit-keyframes zoomOutDown { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + -webkit-transform-origin: center bottom; + transform-origin: center bottom; + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomOutDown { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + -webkit-transform-origin: center bottom; + transform-origin: center bottom; + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomOutDown { + -webkit-animation-name: zoomOutDown; + animation-name: zoomOutDown; +} + +@-webkit-keyframes zoomOutLeft { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); + transform: scale(.1) translate3d(-2000px, 0, 0); + -webkit-transform-origin: left center; + transform-origin: left center; + } +} + +@keyframes zoomOutLeft { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); + transform: scale(.1) translate3d(-2000px, 0, 0); + -webkit-transform-origin: left center; + transform-origin: left center; + } +} + +.zoomOutLeft { + -webkit-animation-name: zoomOutLeft; + animation-name: zoomOutLeft; +} + +@-webkit-keyframes zoomOutRight { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: scale(.1) translate3d(2000px, 0, 0); + transform: scale(.1) translate3d(2000px, 0, 0); + -webkit-transform-origin: right center; + transform-origin: right center; + } +} + +@keyframes zoomOutRight { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + } + + 100% { + opacity: 0; + -webkit-transform: scale(.1) translate3d(2000px, 0, 0); + transform: scale(.1) translate3d(2000px, 0, 0); + -webkit-transform-origin: right center; + transform-origin: right center; + } +} + +.zoomOutRight { + -webkit-animation-name: zoomOutRight; + animation-name: zoomOutRight; +} + +@-webkit-keyframes zoomOutUp { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + -webkit-transform-origin: center bottom; + transform-origin: center bottom; + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +@keyframes zoomOutUp { + 40% { + opacity: 1; + -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + -webkit-transform-origin: center bottom; + transform-origin: center bottom; + -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomOutUp { + -webkit-animation-name: zoomOutUp; + animation-name: zoomOutUp; +} + +@-webkit-keyframes slideInDown { + from { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +@keyframes slideInDown { + from { + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +.slideInDown { + -webkit-animation-name: slideInDown; + animation-name: slideInDown; +} + +@-webkit-keyframes slideInLeft { + from { + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +@keyframes slideInLeft { + from { + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +.slideInLeft { + -webkit-animation-name: slideInLeft; + animation-name: slideInLeft; +} + +@-webkit-keyframes slideInRight { + from { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +@keyframes slideInRight { + from { + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +.slideInRight { + -webkit-animation-name: slideInRight; + animation-name: slideInRight; +} + +@-webkit-keyframes slideInUp { + from { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +@keyframes slideInUp { + from { + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + visibility: visible; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } +} + +.slideInUp { + -webkit-animation-name: slideInUp; + animation-name: slideInUp; +} + +@-webkit-keyframes slideOutDown { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } +} + +@keyframes slideOutDown { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0); + } +} + +.slideOutDown { + -webkit-animation-name: slideOutDown; + animation-name: slideOutDown; +} + +@-webkit-keyframes slideOutLeft { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } +} + +@keyframes slideOutLeft { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0); + } +} + +.slideOutLeft { + -webkit-animation-name: slideOutLeft; + animation-name: slideOutLeft; +} + +@-webkit-keyframes slideOutRight { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } +} + +@keyframes slideOutRight { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0); + } +} + +.slideOutRight { + -webkit-animation-name: slideOutRight; + animation-name: slideOutRight; +} + +@-webkit-keyframes slideOutUp { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } +} + +@keyframes slideOutUp { + from { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + -webkit-transform: translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0); + } +} + +.slideOutUp { + -webkit-animation-name: slideOutUp; + animation-name: slideOutUp; +} \ No newline at end of file diff --git a/src/Games/Flexcode/node_modules/animate.css/animate.min.css b/src/Games/Flexcode/node_modules/animate.css/animate.min.css new file mode 100644 index 00000000..0b6a47de --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/animate.min.css @@ -0,0 +1,6 @@ +@charset "UTF-8";/*! +Animate.css - http://daneden.me/animate +Licensed under the MIT license - http://opensource.org/licenses/MIT + +Copyright (c) 2015 Daniel Eden +*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{100%,20%,53%,80%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{100%,20%,53%,80%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{100%,50%,from{opacity:1}25%,75%{opacity:0}}@keyframes flash{100%,50%,from{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{100%,from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{100%,from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes tada{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}@keyframes wobble{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{100%,11.1%,from{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{100%,11.1%,from{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn{100%,20%,40%,60%,80%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{100%,20%,40%,60%,80%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInDown{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInRight{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{100%,60%,75%,90%,from{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{from{opacity:0}100%{opacity:1}}@keyframes fadeIn{from{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{from{opacity:1}100%{opacity:0}}@keyframes fadeOut{from{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{from{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{from{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{from{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{from{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{from{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{from{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{from{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}@keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}100%{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp} \ No newline at end of file diff --git a/src/Games/Flexcode/node_modules/animate.css/bower.json b/src/Games/Flexcode/node_modules/animate.css/bower.json new file mode 100644 index 00000000..76937bae --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/bower.json @@ -0,0 +1,12 @@ +{ + "name": "animate.css", + "main": "./animate.css", + "ignore": [ + ".*", + "src", + "*.yml", + "Gemfile", + "Gemfile.lock", + "*.md" + ] +} diff --git a/src/Games/Flexcode/node_modules/animate.css/package.json b/src/Games/Flexcode/node_modules/animate.css/package.json new file mode 100644 index 00000000..79a73d06 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/package.json @@ -0,0 +1,55 @@ +{ + "name": "animate.css", + "version": "3.4.0", + "repository": { + "type": "git", + "url": "git+https://github.com/daneden/animate.css.git" + }, + "license": "MIT", + "jspm": { + "main": "animate.css!", + "format": "global", + "directories": { + "lib": "./" + } + }, + "devDependencies": { + "grunt": "~0.4.1", + "grunt-autoprefixer": "~0.4.0", + "grunt-contrib-watch": "~0.5.3", + "grunt-contrib-concat": "~0.3.0", + "grunt-contrib-cssmin": "~0.8.0", + "load-grunt-tasks": "~0.2.0" + }, + "spm": { + "main": "./animate.css" + }, + "gitHead": "f1ce5d863ead842422d77f46038c5e09794e1eab", + "description": "*Just-add-water CSS animation*", + "bugs": { + "url": "https://github.com/daneden/animate.css/issues" + }, + "homepage": "https://github.com/daneden/animate.css#readme", + "_id": "animate.css@3.4.0", + "scripts": {}, + "_shasum": "27302ef999aed9f6355456216812f03a8fa46d54", + "_from": "animate.css@*", + "_npmVersion": "2.10.1", + "_nodeVersion": "0.12.4", + "_npmUser": { + "name": "dte", + "email": "dan.eden@me.com" + }, + "dist": { + "shasum": "27302ef999aed9f6355456216812f03a8fa46d54", + "tarball": "http://registry.npmjs.org/animate.css/-/animate.css-3.4.0.tgz" + }, + "maintainers": [ + { + "name": "dte", + "email": "dan.eden@me.com" + } + ], + "directories": {}, + "_resolved": "https://registry.npmjs.org/animate.css/-/animate.css-3.4.0.tgz" +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/_base.css b/src/Games/Flexcode/node_modules/animate.css/source/_base.css new file mode 100644 index 00000000..7fa880bc --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/_base.css @@ -0,0 +1,27 @@ +@charset "UTF-8"; +/*! +Animate.css - http://daneden.me/animate +Licensed under the MIT license - http://opensource.org/licenses/MIT + +Copyright (c) 2015 Daniel Eden +*/ + +.animated { + animation-duration: 1s; + animation-fill-mode: both; +} + +.animated.infinite { + animation-iteration-count: infinite; +} + +.animated.hinge { + animation-duration: 2s; +} + +.animated.flipOutX, +.animated.flipOutY, +.animated.bounceIn, +.animated.bounceOut{ + animation-duration: .75s; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/bounce.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/bounce.css new file mode 100644 index 00000000..8c40c0fa --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/bounce.css @@ -0,0 +1,25 @@ +@keyframes bounce { + from, 20%, 53%, 80%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + transform: translate3d(0,0,0); + } + + 40%, 43% { + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + transform: translate3d(0, -30px, 0); + } + + 70% { + animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); + transform: translate3d(0, -15px, 0); + } + + 90% { + transform: translate3d(0,-4px,0); + } +} + +.bounce { + animation-name: bounce; + transform-origin: center bottom; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/flash.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/flash.css new file mode 100644 index 00000000..c4622e60 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/flash.css @@ -0,0 +1,13 @@ +@keyframes flash { + from, 50%, 100% { + opacity: 1; + } + + 25%, 75% { + opacity: 0; + } +} + +.flash { + animation-name: flash; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/jello.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/jello.css new file mode 100644 index 00000000..d61f27f1 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/jello.css @@ -0,0 +1,33 @@ +@keyframes jello { + from, 11.1%, 100% { + transform: none + } + 22.2% { + transform: skewX(-12.5deg) skewY(-12.5deg) + } + 33.3% { + transform: skewX(6.25deg) skewY(6.25deg) + } + 44.4% { + transform: skewX(-3.125deg) skewY(-3.125deg) + } + 55.5% { + transform: skewX(1.5625deg) skewY(1.5625deg) + } + 66.6% { + transform: skewX(-0.78125deg) skewY(-0.78125deg) + } + 77.7% { + transform: skewX(0.390625deg) skewY(0.390625deg) + } + 88.8% { + transform: skewX(-0.1953125deg) skewY(-0.1953125deg) + } +} + + + +.jello{ + animation-name:jello; + transform-origin: center +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/pulse.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/pulse.css new file mode 100644 index 00000000..3dec6524 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/pulse.css @@ -0,0 +1,19 @@ +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@keyframes pulse { + from { + transform: scale3d(1, 1, 1); + } + + 50% { + transform: scale3d(1.05, 1.05, 1.05); + } + + 100% { + transform: scale3d(1, 1, 1); + } +} + +.pulse { + animation-name: pulse; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/rubberBand.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/rubberBand.css new file mode 100644 index 00000000..e2789fb2 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/rubberBand.css @@ -0,0 +1,33 @@ +@keyframes rubberBand { + from { + transform: scale3d(1, 1, 1); + } + + 30% { + transform: scale3d(1.25, 0.75, 1); + } + + 40% { + transform: scale3d(0.75, 1.25, 1); + } + + 50% { + transform: scale3d(1.15, 0.85, 1); + } + + 65% { + transform: scale3d(.95, 1.05, 1); + } + + 75% { + transform: scale3d(1.05, .95, 1); + } + + 100% { + transform: scale3d(1, 1, 1); + } +} + +.rubberBand { + animation-name: rubberBand; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/shake.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/shake.css new file mode 100644 index 00000000..61c6f48e --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/shake.css @@ -0,0 +1,17 @@ +@keyframes shake { + from, 100% { + transform: translate3d(0, 0, 0); + } + + 10%, 30%, 50%, 70%, 90% { + transform: translate3d(-10px, 0, 0); + } + + 20%, 40%, 60%, 80% { + transform: translate3d(10px, 0, 0); + } +} + +.shake { + animation-name: shake; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/swing.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/swing.css new file mode 100644 index 00000000..ce6a2117 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/swing.css @@ -0,0 +1,26 @@ +@keyframes swing { + 20% { + transform: rotate3d(0, 0, 1, 15deg); + } + + 40% { + transform: rotate3d(0, 0, 1, -10deg); + } + + 60% { + transform: rotate3d(0, 0, 1, 5deg); + } + + 80% { + transform: rotate3d(0, 0, 1, -5deg); + } + + 100% { + transform: rotate3d(0, 0, 1, 0deg); + } +} + +.swing { + transform-origin: top center; + animation-name: swing; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/tada.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/tada.css new file mode 100644 index 00000000..78b68061 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/tada.css @@ -0,0 +1,25 @@ +@keyframes tada { + from { + transform: scale3d(1, 1, 1); + } + + 10%, 20% { + transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); + } + + 30%, 50%, 70%, 90% { + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); + } + + 40%, 60%, 80% { + transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); + } + + 100% { + transform: scale3d(1, 1, 1); + } +} + +.tada { + animation-name: tada; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/wobble.css b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/wobble.css new file mode 100644 index 00000000..9cfe501f --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/attention_seekers/wobble.css @@ -0,0 +1,35 @@ +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@keyframes wobble { + from { + transform: none; + } + + 15% { + transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); + } + + 30% { + transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); + } + + 45% { + transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); + } + + 60% { + transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); + } + + 75% { + transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); + } + + 100% { + transform: none; + } +} + +.wobble { + animation-name: wobble; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceIn.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceIn.css new file mode 100644 index 00000000..ad0e93e1 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceIn.css @@ -0,0 +1,36 @@ +@keyframes bounceIn { + from, 20%, 40%, 60%, 80%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + transform: scale3d(.3, .3, .3); + } + + 20% { + transform: scale3d(1.1, 1.1, 1.1); + } + + 40% { + transform: scale3d(.9, .9, .9); + } + + 60% { + opacity: 1; + transform: scale3d(1.03, 1.03, 1.03); + } + + 80% { + transform: scale3d(.97, .97, .97); + } + + 100% { + opacity: 1; + transform: scale3d(1, 1, 1); + } +} + +.bounceIn { + animation-name: bounceIn; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInDown.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInDown.css new file mode 100644 index 00000000..0a27d323 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInDown.css @@ -0,0 +1,31 @@ +@keyframes bounceInDown { + from, 60%, 75%, 90%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + transform: translate3d(0, -3000px, 0); + } + + 60% { + opacity: 1; + transform: translate3d(0, 25px, 0); + } + + 75% { + transform: translate3d(0, -10px, 0); + } + + 90% { + transform: translate3d(0, 5px, 0); + } + + 100% { + transform: none; + } +} + +.bounceInDown { + animation-name: bounceInDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInLeft.css new file mode 100644 index 00000000..b1eed00e --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInLeft.css @@ -0,0 +1,31 @@ +@keyframes bounceInLeft { + from, 60%, 75%, 90%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + 0% { + opacity: 0; + transform: translate3d(-3000px, 0, 0); + } + + 60% { + opacity: 1; + transform: translate3d(25px, 0, 0); + } + + 75% { + transform: translate3d(-10px, 0, 0); + } + + 90% { + transform: translate3d(5px, 0, 0); + } + + 100% { + transform: none; + } +} + +.bounceInLeft { + animation-name: bounceInLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInRight.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInRight.css new file mode 100644 index 00000000..48d8b715 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInRight.css @@ -0,0 +1,31 @@ +@keyframes bounceInRight { + from, 60%, 75%, 90%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + transform: translate3d(3000px, 0, 0); + } + + 60% { + opacity: 1; + transform: translate3d(-25px, 0, 0); + } + + 75% { + transform: translate3d(10px, 0, 0); + } + + 90% { + transform: translate3d(-5px, 0, 0); + } + + 100% { + transform: none; + } +} + +.bounceInRight { + animation-name: bounceInRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInUp.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInUp.css new file mode 100644 index 00000000..a08ed6a1 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_entrances/bounceInUp.css @@ -0,0 +1,31 @@ +@keyframes bounceInUp { + from, 60%, 75%, 90%, 100% { + animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); + } + + from { + opacity: 0; + transform: translate3d(0, 3000px, 0); + } + + 60% { + opacity: 1; + transform: translate3d(0, -20px, 0); + } + + 75% { + transform: translate3d(0, 10px, 0); + } + + 90% { + transform: translate3d(0, -5px, 0); + } + + 100% { + transform: translate3d(0, 0, 0); + } +} + +.bounceInUp { + animation-name: bounceInUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOut.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOut.css new file mode 100644 index 00000000..dfb64454 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOut.css @@ -0,0 +1,19 @@ +@keyframes bounceOut { + 20% { + transform: scale3d(.9, .9, .9); + } + + 50%, 55% { + opacity: 1; + transform: scale3d(1.1, 1.1, 1.1); + } + + 100% { + opacity: 0; + transform: scale3d(.3, .3, .3); + } +} + +.bounceOut { + animation-name: bounceOut; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutDown.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutDown.css new file mode 100644 index 00000000..c9766ca0 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutDown.css @@ -0,0 +1,19 @@ +@keyframes bounceOutDown { + 20% { + transform: translate3d(0, 10px, 0); + } + + 40%, 45% { + opacity: 1; + transform: translate3d(0, -20px, 0); + } + + 100% { + opacity: 0; + transform: translate3d(0, 2000px, 0); + } +} + +.bounceOutDown { + animation-name: bounceOutDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutLeft.css new file mode 100644 index 00000000..5c6bef12 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutLeft.css @@ -0,0 +1,15 @@ +@keyframes bounceOutLeft { + 20% { + opacity: 1; + transform: translate3d(20px, 0, 0); + } + + 100% { + opacity: 0; + transform: translate3d(-2000px, 0, 0); + } +} + +.bounceOutLeft { + animation-name: bounceOutLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutRight.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutRight.css new file mode 100644 index 00000000..70b16335 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutRight.css @@ -0,0 +1,15 @@ +@keyframes bounceOutRight { + 20% { + opacity: 1; + transform: translate3d(-20px, 0, 0); + } + + 100% { + opacity: 0; + transform: translate3d(2000px, 0, 0); + } +} + +.bounceOutRight { + animation-name: bounceOutRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutUp.css b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutUp.css new file mode 100644 index 00000000..93af49cb --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/bouncing_exits/bounceOutUp.css @@ -0,0 +1,19 @@ +@keyframes bounceOutUp { + 20% { + transform: translate3d(0, -10px, 0); + } + + 40%, 45% { + opacity: 1; + transform: translate3d(0, 20px, 0); + } + + 100% { + opacity: 0; + transform: translate3d(0, -2000px, 0); + } +} + +.bounceOutUp { + animation-name: bounceOutUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeIn.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeIn.css new file mode 100644 index 00000000..a2f10399 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeIn.css @@ -0,0 +1,8 @@ +@keyframes fadeIn { + from {opacity: 0;} + 100% {opacity: 1;} +} + +.fadeIn { + animation-name: fadeIn; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDown.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDown.css new file mode 100644 index 00000000..4b257b95 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDown.css @@ -0,0 +1,15 @@ +@keyframes fadeInDown { + from { + opacity: 0; + transform: translate3d(0, -100%, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInDown { + animation-name: fadeInDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDownBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDownBig.css new file mode 100644 index 00000000..f1b09757 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInDownBig.css @@ -0,0 +1,15 @@ +@keyframes fadeInDownBig { + from { + opacity: 0; + transform: translate3d(0, -2000px, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInDownBig { + animation-name: fadeInDownBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeft.css new file mode 100644 index 00000000..d081b1fd --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeft.css @@ -0,0 +1,15 @@ +@keyframes fadeInLeft { + from { + opacity: 0; + transform: translate3d(-100%, 0, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInLeft { + animation-name: fadeInLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeftBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeftBig.css new file mode 100644 index 00000000..788878af --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInLeftBig.css @@ -0,0 +1,15 @@ +@keyframes fadeInLeftBig { + from { + opacity: 0; + transform: translate3d(-2000px, 0, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInLeftBig { + animation-name: fadeInLeftBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRight.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRight.css new file mode 100644 index 00000000..50f13ca1 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRight.css @@ -0,0 +1,15 @@ +@keyframes fadeInRight { + from { + opacity: 0; + transform: translate3d(100%, 0, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInRight { + animation-name: fadeInRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRightBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRightBig.css new file mode 100644 index 00000000..66161890 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInRightBig.css @@ -0,0 +1,15 @@ +@keyframes fadeInRightBig { + from { + opacity: 0; + transform: translate3d(2000px, 0, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInRightBig { + animation-name: fadeInRightBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUp.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUp.css new file mode 100644 index 00000000..339df08e --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUp.css @@ -0,0 +1,15 @@ +@keyframes fadeInUp { + from { + opacity: 0; + transform: translate3d(0, 100%, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInUp { + animation-name: fadeInUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUpBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUpBig.css new file mode 100644 index 00000000..5c968180 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_entrances/fadeInUpBig.css @@ -0,0 +1,15 @@ +@keyframes fadeInUpBig { + from { + opacity: 0; + transform: translate3d(0, 2000px, 0); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.fadeInUpBig { + animation-name: fadeInUpBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOut.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOut.css new file mode 100644 index 00000000..9629b24e --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOut.css @@ -0,0 +1,8 @@ +@keyframes fadeOut { + from {opacity: 1;} + 100% {opacity: 0;} +} + +.fadeOut { + animation-name: fadeOut; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDown.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDown.css new file mode 100644 index 00000000..76d92790 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDown.css @@ -0,0 +1,14 @@ +@keyframes fadeOutDown { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(0, 100%, 0); + } +} + +.fadeOutDown { + animation-name: fadeOutDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDownBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDownBig.css new file mode 100644 index 00000000..0a289d7c --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutDownBig.css @@ -0,0 +1,14 @@ +@keyframes fadeOutDownBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(0, 2000px, 0); + } +} + +.fadeOutDownBig { + animation-name: fadeOutDownBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeft.css new file mode 100644 index 00000000..7cda98c4 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeft.css @@ -0,0 +1,14 @@ +@keyframes fadeOutLeft { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(-100%, 0, 0); + } +} + +.fadeOutLeft { + animation-name: fadeOutLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeftBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeftBig.css new file mode 100644 index 00000000..8c71e8a7 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutLeftBig.css @@ -0,0 +1,14 @@ +@keyframes fadeOutLeftBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(-2000px, 0, 0); + } +} + +.fadeOutLeftBig { + animation-name: fadeOutLeftBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRight.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRight.css new file mode 100644 index 00000000..9366cfff --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRight.css @@ -0,0 +1,14 @@ +@keyframes fadeOutRight { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(100%, 0, 0); + } +} + +.fadeOutRight { + animation-name: fadeOutRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRightBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRightBig.css new file mode 100644 index 00000000..ca73cba8 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutRightBig.css @@ -0,0 +1,14 @@ +@keyframes fadeOutRightBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(2000px, 0, 0); + } +} + +.fadeOutRightBig { + animation-name: fadeOutRightBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUp.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUp.css new file mode 100644 index 00000000..d1134cbb --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUp.css @@ -0,0 +1,14 @@ +@keyframes fadeOutUp { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(0, -100%, 0); + } +} + +.fadeOutUp { + animation-name: fadeOutUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUpBig.css b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUpBig.css new file mode 100644 index 00000000..9846d702 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/fading_exits/fadeOutUpBig.css @@ -0,0 +1,14 @@ +@keyframes fadeOutUpBig { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(0, -2000px, 0); + } +} + +.fadeOutUpBig { + animation-name: fadeOutUpBig; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/flippers/flip.css b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flip.css new file mode 100644 index 00000000..d33f761d --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flip.css @@ -0,0 +1,31 @@ +@keyframes flip { + from { + transform: perspective(400px) rotate3d(0, 1, 0, -360deg); + animation-timing-function: ease-out; + } + + 40% { + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); + animation-timing-function: ease-out; + } + + 50% { + transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); + animation-timing-function: ease-in; + } + + 80% { + transform: perspective(400px) scale3d(.95, .95, .95); + animation-timing-function: ease-in; + } + + 100% { + transform: perspective(400px); + animation-timing-function: ease-in; + } +} + +.animated.flip { + backface-visibility: visible; + animation-name: flip; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInX.css b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInX.css new file mode 100644 index 00000000..d0a9b81f --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInX.css @@ -0,0 +1,30 @@ +@keyframes flipInX { + from { + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + animation-timing-function: ease-in; + } + + 60% { + transform: perspective(400px) rotate3d(1, 0, 0, 10deg); + opacity: 1; + } + + 80% { + transform: perspective(400px) rotate3d(1, 0, 0, -5deg); + } + + 100% { + transform: perspective(400px); + } +} + +.flipInX { + backface-visibility: visible !important; + animation-name: flipInX; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInY.css b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInY.css new file mode 100644 index 00000000..6cc704ed --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipInY.css @@ -0,0 +1,30 @@ +@keyframes flipInY { + from { + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + animation-timing-function: ease-in; + opacity: 0; + } + + 40% { + transform: perspective(400px) rotate3d(0, 1, 0, -20deg); + animation-timing-function: ease-in; + } + + 60% { + transform: perspective(400px) rotate3d(0, 1, 0, 10deg); + opacity: 1; + } + + 80% { + transform: perspective(400px) rotate3d(0, 1, 0, -5deg); + } + + 100% { + transform: perspective(400px); + } +} + +.flipInY { + backface-visibility: visible !important; + animation-name: flipInY; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutX.css b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutX.css new file mode 100644 index 00000000..57d2ed31 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutX.css @@ -0,0 +1,20 @@ +@keyframes flipOutX { + from { + transform: perspective(400px); + } + + 30% { + transform: perspective(400px) rotate3d(1, 0, 0, -20deg); + opacity: 1; + } + + 100% { + transform: perspective(400px) rotate3d(1, 0, 0, 90deg); + opacity: 0; + } +} + +.flipOutX { + animation-name: flipOutX; + backface-visibility: visible !important; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutY.css b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutY.css new file mode 100644 index 00000000..b028e0f6 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/flippers/flipOutY.css @@ -0,0 +1,20 @@ +@keyframes flipOutY { + from { + transform: perspective(400px); + } + + 30% { + transform: perspective(400px) rotate3d(0, 1, 0, -15deg); + opacity: 1; + } + + 100% { + transform: perspective(400px) rotate3d(0, 1, 0, 90deg); + opacity: 0; + } +} + +.flipOutY { + backface-visibility: visible !important; + animation-name: flipOutY; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedIn.css b/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedIn.css new file mode 100644 index 00000000..0ac15530 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedIn.css @@ -0,0 +1,26 @@ +@keyframes lightSpeedIn { + from { + transform: translate3d(100%, 0, 0) skewX(-30deg); + opacity: 0; + } + + 60% { + transform: skewX(20deg); + opacity: 1; + } + + 80% { + transform: skewX(-5deg); + opacity: 1; + } + + 100% { + transform: none; + opacity: 1; + } +} + +.lightSpeedIn { + animation-name: lightSpeedIn; + animation-timing-function: ease-out; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedOut.css b/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedOut.css new file mode 100644 index 00000000..2ddc9a2a --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/lightspeed/lightSpeedOut.css @@ -0,0 +1,15 @@ +@keyframes lightSpeedOut { + from { + opacity: 1; + } + + 100% { + transform: translate3d(100%, 0, 0) skewX(30deg); + opacity: 0; + } +} + +.lightSpeedOut { + animation-name: lightSpeedOut; + animation-timing-function: ease-in; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateIn.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateIn.css new file mode 100644 index 00000000..aeb6fc22 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateIn.css @@ -0,0 +1,17 @@ +@keyframes rotateIn { + from { + transform-origin: center; + transform: rotate3d(0, 0, 1, -200deg); + opacity: 0; + } + + 100% { + transform-origin: center; + transform: none; + opacity: 1; + } +} + +.rotateIn { + animation-name: rotateIn; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownLeft.css new file mode 100644 index 00000000..9ca4dde4 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownLeft.css @@ -0,0 +1,17 @@ +@keyframes rotateInDownLeft { + from { + transform-origin: left bottom; + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } + + 100% { + transform-origin: left bottom; + transform: none; + opacity: 1; + } +} + +.rotateInDownLeft { + animation-name: rotateInDownLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownRight.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownRight.css new file mode 100644 index 00000000..6905fea4 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInDownRight.css @@ -0,0 +1,17 @@ +@keyframes rotateInDownRight { + from { + transform-origin: right bottom; + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + transform-origin: right bottom; + transform: none; + opacity: 1; + } +} + +.rotateInDownRight { + animation-name: rotateInDownRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpLeft.css new file mode 100644 index 00000000..b12231ca --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpLeft.css @@ -0,0 +1,17 @@ +@keyframes rotateInUpLeft { + from { + transform-origin: left bottom; + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } + + 100% { + transform-origin: left bottom; + transform: none; + opacity: 1; + } +} + +.rotateInUpLeft { + animation-name: rotateInUpLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpRight.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpRight.css new file mode 100644 index 00000000..b84a4535 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_entrances/rotateInUpRight.css @@ -0,0 +1,17 @@ +@keyframes rotateInUpRight { + from { + transform-origin: right bottom; + transform: rotate3d(0, 0, 1, -90deg); + opacity: 0; + } + + 100% { + transform-origin: right bottom; + transform: none; + opacity: 1; + } +} + +.rotateInUpRight { + animation-name: rotateInUpRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOut.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOut.css new file mode 100644 index 00000000..29790f48 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOut.css @@ -0,0 +1,16 @@ +@keyframes rotateOut { + from { + transform-origin: center; + opacity: 1; + } + + 100% { + transform-origin: center; + transform: rotate3d(0, 0, 1, 200deg); + opacity: 0; + } +} + +.rotateOut { + animation-name: rotateOut; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownLeft.css new file mode 100644 index 00000000..18f9c170 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownLeft.css @@ -0,0 +1,16 @@ +@keyframes rotateOutDownLeft { + from { + transform-origin: left bottom; + opacity: 1; + } + + 100% { + transform-origin: left bottom; + transform: rotate3d(0, 0, 1, 45deg); + opacity: 0; + } +} + +.rotateOutDownLeft { + animation-name: rotateOutDownLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownRight.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownRight.css new file mode 100644 index 00000000..de20f6a3 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutDownRight.css @@ -0,0 +1,16 @@ +@keyframes rotateOutDownRight { + from { + transform-origin: right bottom; + opacity: 1; + } + + 100% { + transform-origin: right bottom; + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +.rotateOutDownRight { + animation-name: rotateOutDownRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpLeft.css new file mode 100644 index 00000000..5bfbbf02 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpLeft.css @@ -0,0 +1,16 @@ +@keyframes rotateOutUpLeft { + from { + transform-origin: left bottom; + opacity: 1; + } + + 100% { + transform-origin: left bottom; + transform: rotate3d(0, 0, 1, -45deg); + opacity: 0; + } +} + +.rotateOutUpLeft { + animation-name: rotateOutUpLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpRight.css b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpRight.css new file mode 100644 index 00000000..039ef155 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/rotating_exits/rotateOutUpRight.css @@ -0,0 +1,16 @@ +@keyframes rotateOutUpRight { + from { + transform-origin: right bottom; + opacity: 1; + } + + 100% { + transform-origin: right bottom; + transform: rotate3d(0, 0, 1, 90deg); + opacity: 0; + } +} + +.rotateOutUpRight { + animation-name: rotateOutUpRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInDown.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInDown.css new file mode 100644 index 00000000..a5589a54 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInDown.css @@ -0,0 +1,14 @@ +@keyframes slideInDown { + from { + transform: translate3d(0, -100%, 0); + visibility: visible; + } + + 100% { + transform: translate3d(0, 0, 0); + } +} + +.slideInDown { + animation-name: slideInDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInLeft.css new file mode 100644 index 00000000..966c5f7c --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInLeft.css @@ -0,0 +1,14 @@ +@keyframes slideInLeft { + from { + transform: translate3d(-100%, 0, 0); + visibility: visible; + } + + 100% { + transform: translate3d(0, 0, 0); + } +} + +.slideInLeft { + animation-name: slideInLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInRight.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInRight.css new file mode 100644 index 00000000..6e5e0b1d --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInRight.css @@ -0,0 +1,14 @@ +@keyframes slideInRight { + from { + transform: translate3d(100%, 0, 0); + visibility: visible; + } + + 100% { + transform: translate3d(0, 0, 0); + } +} + +.slideInRight { + animation-name: slideInRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInUp.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInUp.css new file mode 100644 index 00000000..b5444093 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_entrances/slideInUp.css @@ -0,0 +1,14 @@ +@keyframes slideInUp { + from { + transform: translate3d(0, 100%, 0); + visibility: visible; + } + + 100% { + transform: translate3d(0, 0, 0); + } +} + +.slideInUp { + animation-name: slideInUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutDown.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutDown.css new file mode 100644 index 00000000..d5ed4907 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutDown.css @@ -0,0 +1,14 @@ +@keyframes slideOutDown { + from { + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + transform: translate3d(0, 100%, 0); + } +} + +.slideOutDown { + animation-name: slideOutDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutLeft.css new file mode 100644 index 00000000..cff4f3af --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutLeft.css @@ -0,0 +1,14 @@ +@keyframes slideOutLeft { + from { + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + transform: translate3d(-100%, 0, 0); + } +} + +.slideOutLeft { + animation-name: slideOutLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutRight.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutRight.css new file mode 100644 index 00000000..f796db36 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutRight.css @@ -0,0 +1,14 @@ +@keyframes slideOutRight { + from { + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + transform: translate3d(100%, 0, 0); + } +} + +.slideOutRight { + animation-name: slideOutRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutUp.css b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutUp.css new file mode 100644 index 00000000..83c35372 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/sliding_exits/slideOutUp.css @@ -0,0 +1,14 @@ +@keyframes slideOutUp { + from { + transform: translate3d(0, 0, 0); + } + + 100% { + visibility: hidden; + transform: translate3d(0, -100%, 0); + } +} + +.slideOutUp { + animation-name: slideOutUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/specials/hinge.css b/src/Games/Flexcode/node_modules/animate.css/source/specials/hinge.css new file mode 100644 index 00000000..5b838fb6 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/specials/hinge.css @@ -0,0 +1,28 @@ +@keyframes hinge { + 0% { + transform-origin: top left; + animation-timing-function: ease-in-out; + } + + 20%, 60% { + transform: rotate3d(0, 0, 1, 80deg); + transform-origin: top left; + animation-timing-function: ease-in-out; + } + + 40%, 80% { + transform: rotate3d(0, 0, 1, 60deg); + transform-origin: top left; + animation-timing-function: ease-in-out; + opacity: 1; + } + + 100% { + transform: translate3d(0, 700px, 0); + opacity: 0; + } +} + +.hinge { + animation-name: hinge; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/specials/rollIn.css b/src/Games/Flexcode/node_modules/animate.css/source/specials/rollIn.css new file mode 100644 index 00000000..92526cb5 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/specials/rollIn.css @@ -0,0 +1,17 @@ +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@keyframes rollIn { + from { + opacity: 0; + transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); + } + + 100% { + opacity: 1; + transform: none; + } +} + +.rollIn { + animation-name: rollIn; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/specials/rollOut.css b/src/Games/Flexcode/node_modules/animate.css/source/specials/rollOut.css new file mode 100644 index 00000000..328a891d --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/specials/rollOut.css @@ -0,0 +1,16 @@ +/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ + +@keyframes rollOut { + from { + opacity: 1; + } + + 100% { + opacity: 0; + transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); + } +} + +.rollOut { + animation-name: rollOut; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomIn.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomIn.css new file mode 100644 index 00000000..fe430134 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomIn.css @@ -0,0 +1,14 @@ +@keyframes zoomIn { + from { + opacity: 0; + transform: scale3d(.3, .3, .3); + } + + 50% { + opacity: 1; + } +} + +.zoomIn { + animation-name: zoomIn; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInDown.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInDown.css new file mode 100644 index 00000000..f5d60a44 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInDown.css @@ -0,0 +1,17 @@ +@keyframes zoomInDown { + from { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInDown { + animation-name: zoomInDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInLeft.css new file mode 100644 index 00000000..1e3ddfe0 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInLeft.css @@ -0,0 +1,17 @@ +@keyframes zoomInLeft { + from { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInLeft { + animation-name: zoomInLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInRight.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInRight.css new file mode 100644 index 00000000..276da661 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInRight.css @@ -0,0 +1,17 @@ +@keyframes zoomInRight { + from { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInRight { + animation-name: zoomInRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInUp.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInUp.css new file mode 100644 index 00000000..c3e23a41 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_entrances/zoomInUp.css @@ -0,0 +1,17 @@ +@keyframes zoomInUp { + from { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 60% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomInUp { + animation-name: zoomInUp; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOut.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOut.css new file mode 100644 index 00000000..334973cd --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOut.css @@ -0,0 +1,18 @@ +@keyframes zoomOut { + from { + opacity: 1; + } + + 50% { + opacity: 0; + transform: scale3d(.3, .3, .3); + } + + 100% { + opacity: 0; + } +} + +.zoomOut { + animation-name: zoomOut; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutDown.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutDown.css new file mode 100644 index 00000000..aeff0120 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutDown.css @@ -0,0 +1,18 @@ +@keyframes zoomOutDown { + 40% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); + transform-origin: center bottom; + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomOutDown { + animation-name: zoomOutDown; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutLeft.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutLeft.css new file mode 100644 index 00000000..19752215 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutLeft.css @@ -0,0 +1,16 @@ +@keyframes zoomOutLeft { + 40% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); + } + + 100% { + opacity: 0; + transform: scale(.1) translate3d(-2000px, 0, 0); + transform-origin: left center; + } +} + +.zoomOutLeft { + animation-name: zoomOutLeft; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutRight.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutRight.css new file mode 100644 index 00000000..f3a068b0 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutRight.css @@ -0,0 +1,16 @@ +@keyframes zoomOutRight { + 40% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); + } + + 100% { + opacity: 0; + transform: scale(.1) translate3d(2000px, 0, 0); + transform-origin: right center; + } +} + +.zoomOutRight { + animation-name: zoomOutRight; +} diff --git a/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutUp.css b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutUp.css new file mode 100644 index 00000000..efa76aa2 --- /dev/null +++ b/src/Games/Flexcode/node_modules/animate.css/source/zooming_exits/zoomOutUp.css @@ -0,0 +1,18 @@ +@keyframes zoomOutUp { + 40% { + opacity: 1; + transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); + animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); + } + + 100% { + opacity: 0; + transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); + transform-origin: center bottom; + animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); + } +} + +.zoomOutUp { + animation-name: zoomOutUp; +} diff --git a/src/Games/Flexcode/node_modules/jquery/AUTHORS.txt b/src/Games/Flexcode/node_modules/jquery/AUTHORS.txt new file mode 100644 index 00000000..fc0456e3 --- /dev/null +++ b/src/Games/Flexcode/node_modules/jquery/AUTHORS.txt @@ -0,0 +1,327 @@ +John Resig +Gilles van den Hoven +Michael Geary +Stefan Petre +Yehuda Katz +Corey Jewett +Klaus Hartl +Franck Marcia +Jörn Zaefferer +Paul Bakaus +Brandon Aaron +Mike Alsup +Dave Methvin +Ed Engelhardt +Sean Catchpole +Paul Mclanahan +David Serduke +Richard D. Worth +Scott González +Ariel Flesler +Jon Evans +TJ Holowaychuk +Michael Bensoussan +Robert Katić +Louis-Rémi Babé +Earle Castledine +Damian Janowski +Rich Dougherty +Kim Dalsgaard +Andrea Giammarchi +Mark Gibson +Karl Swedberg +Justin Meyer +Ben Alman +James Padolsey +David Petersen +Batiste Bieler +Alexander Farkas +Rick Waldron +Filipe Fortes +Neeraj Singh +Paul Irish +Iraê Carvalho +Matt Curry +Michael Monteleone +Noah Sloan +Tom Viner +Douglas Neiner +Adam J. Sontag +Dave Reed +Ralph Whitbeck +Carl Fürstenberg +Jacob Wright +J. Ryan Stinnett +unknown +temp01 +Heungsub Lee +Colin Snover +Ryan W Tenney +Pinhook +Ron Otten +Jephte Clain +Anton Matzneller +Alex Sexton +Dan Heberden +Henri Wiechers +Russell Holbrook +Julian Aubourg +Gianni Alessandro Chiappetta +Scott Jehl +James Burke +Jonas Pfenniger +Xavi Ramirez +Jared Grippe +Sylvester Keil +Brandon Sterne +Mathias Bynens +Timmy Willison <4timmywil@gmail.com> +Corey Frang +Digitalxero +Anton Kovalyov +David Murdoch +Josh Varner +Charles McNulty +Jordan Boesch +Jess Thrysoee +Michael Murray +Lee Carpenter +Alexis Abril +Rob Morgan +John Firebaugh +Sam Bisbee +Gilmore Davidson +Brian Brennan +Xavier Montillet +Daniel Pihlstrom +Sahab Yazdani +avaly +Scott Hughes +Mike Sherov +Greg Hazel +Schalk Neethling +Denis Knauf +Timo Tijhof +Steen Nielsen +Anton Ryzhov +Shi Chuan +Berker Peksag +Toby Brain +Matt Mueller +Justin +Daniel Herman +Oleg Gaidarenko +Richard Gibson +Rafaël Blais Masson +cmc3cn <59194618@qq.com> +Joe Presbrey +Sindre Sorhus +Arne de Bree +Vladislav Zarakovsky +Andrew E Monat +Oskari +Joao Henrique de Andrade Bruni +tsinha +Matt Farmer +Trey Hunner +Jason Moon +Jeffery To +Kris Borchers +Vladimir Zhuravlev +Jacob Thornton +Chad Killingsworth +Nowres Rafid +David Benjamin +Uri Gilad +Chris Faulkner +Elijah Manor +Daniel Chatfield +Nikita Govorov +Wesley Walser +Mike Pennisi +Markus Staab +Dave Riddle +Callum Macrae +Benjamin Truyman +James Huston +Erick Ruiz de Chávez +David Bonner +Akintayo Akinwunmi +MORGAN +Ismail Khair +Carl Danley +Mike Petrovich +Greg Lavallee +Daniel Gálvez +Sai Lung Wong +Tom H Fuertes +Roland Eckl +Jay Merrifield +Allen J Schmidt Jr +Jonathan Sampson +Marcel Greter +Matthias Jäggli +David Fox +Yiming He +Devin Cooper +Paul Ramos +Rod Vagg +Bennett Sorbo +Sebastian Burkhard +Zachary Adam Kaplan +nanto_vi +nanto +Danil Somsikov +Ryunosuke SATO +Jean Boussier +Adam Coulombe +Andrew Plummer +Mark Raddatz +Isaac Z. Schlueter +Karl Sieburg +Pascal Borreli +Nguyen Phuc Lam +Dmitry Gusev +Michał Gołębiowski-Owczarek +Li Xudong +Steven Benner +Tom H Fuertes +Renato Oliveira dos Santos +ros3cin +Jason Bedard +Kyle Robinson Young +Chris Talkington +Eddie Monge +Terry Jones +Jason Merino +Jeremy Dunck +Chris Price +Guy Bedford +Amey Sakhadeo +Mike Sidorov +Anthony Ryan +Dominik D. Geyer +George Kats +Lihan Li +Ronny Springer +Chris Antaki +Marian Sollmann +njhamann +Ilya Kantor +David Hong +John Paul +Jakob Stoeck +Christopher Jones +Forbes Lindesay +S. Andrew Sheppard +Leonardo Balter +Roman Reiß +Benjy Cui +Rodrigo Rosenfeld Rosas +John Hoven +Philip Jägenstedt +Christian Kosmowski +Liang Peng +TJ VanToll +Senya Pugach +Aurelio De Rosa +Nazar Mokrynskyi +Amit Merchant +Jason Bedard +Arthur Verschaeve +Dan Hart +Bin Xin +David Corbacho +Veaceslav Grimalschi +Daniel Husar +Frederic Hemberger +Ben Toews +Aditya Raghavan +Victor Homyakov +Shivaji Varma +Nicolas HENRY +Anne-Gaelle Colom +George Mauer +Leonardo Braga +Stephen Edgar +Thomas Tortorini +Winston Howes +Jon Hester +Alexander O'Mara +Bastian Buchholz +Arthur Stolyar +Calvin Metcalf +Mu Haibao +Richard McDaniel +Chris Rebert +Gabriel Schulhof +Gilad Peleg +Martin Naumann +Marek Lewandowski +Bruno Pérel +Reed Loden +Daniel Nill +Yongwoo Jeon +Sean Henderson +Richard Kraaijenhagen +Connor Atherton +Gary Ye +Christian Grete +Liza Ramo +Julian Alexander Murillo +Joelle Fleurantin +Jae Sung Park +Jun Sun +Josh Soref +Henry Wong +Jon Dufresne +Martijn W. van der Lee +Devin Wilson +Steve Mao +Zack Hall +Bernhard M. Wiedemann +Todor Prikumov +Jha Naman +William Robinet +Alexander Lisianoi +Vitaliy Terziev +Joe Trumbull +Alexander K +Damian Senn +Ralin Chimev +Felipe Sateler +Christophe Tafani-Dereeper +Manoj Kumar +David Broder-Rodgers +Alex Louden +Alex Padilla +南漂一卒 +karan-96 +Boom Lee +Andreas Solleder +CDAGaming +Pierre Spring +Shashanka Nataraj +Erik Lax +Matan Kotler-Berkowitz <205matan@gmail.com> +Jordan Beland +Henry Zhu +Saptak Sengupta +Nilton Cesar +basil.belokon +tmybr11 +Luis Emilio Velasco Sanchez +Ed S +Bert Zhang +Andrei Fangli +Marja Hölttä +abnud1 +buddh4 +Pat O'Callaghan +Ahmed.S.ElAfifi +Wonseop Kim +Christian Oliff +Christian Wenz +Sean Robinson +Jonathan +Pierre Grimaud diff --git a/src/Games/Flexcode/node_modules/jquery/LICENSE.txt b/src/Games/Flexcode/node_modules/jquery/LICENSE.txt new file mode 100644 index 00000000..e3dbacb9 --- /dev/null +++ b/src/Games/Flexcode/node_modules/jquery/LICENSE.txt @@ -0,0 +1,20 @@ +Copyright JS Foundation and other contributors, https://js.foundation/ + +Permission is hereby granted, free of charge, to any person obtaining +a copy of this software and associated documentation files (the +"Software"), to deal in the Software without restriction, including +without limitation the rights to use, copy, modify, merge, publish, +distribute, sublicense, and/or sell copies of the Software, and to +permit persons to whom the Software is furnished to do so, subject to +the following conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND +NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE +LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION +OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION +WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/src/Games/Flexcode/node_modules/jquery/README.md b/src/Games/Flexcode/node_modules/jquery/README.md new file mode 100644 index 00000000..71f2dad2 --- /dev/null +++ b/src/Games/Flexcode/node_modules/jquery/README.md @@ -0,0 +1,62 @@ +# jQuery + +> jQuery is a fast, small, and feature-rich JavaScript library. + +For information on how to get started and how to use jQuery, please see [jQuery's documentation](https://api.jquery.com/). +For source files and issues, please visit the [jQuery repo](https://github.com/jquery/jquery). + +If upgrading, please see the [blog post for 3.5.1](https://blog.jquery.com/2020/05/04/jquery-3-5-1-released-fixing-a-regression/). This includes notable differences from the previous version and a more readable changelog. + +## Including jQuery + +Below are some of the most common ways to include jQuery. + +### Browser + +#### Script tag + +```html + +``` + +#### Babel + +[Babel](https://babeljs.io/) is a next generation JavaScript compiler. One of the features is the ability to use ES6/ES2015 modules now, even though browsers do not yet support this feature natively. + +```js +import $ from "jquery"; +``` + +#### Browserify/Webpack + +There are several ways to use [Browserify](http://browserify.org/) and [Webpack](https://webpack.github.io/). For more information on using these tools, please refer to the corresponding project's documentation. In the script, including jQuery will usually look like this... + +```js +var $ = require( "jquery" ); +``` + +#### AMD (Asynchronous Module Definition) + +AMD is a module format built for the browser. For more information, we recommend [require.js' documentation](https://requirejs.org/docs/whyamd.html). + +```js +define( [ "jquery" ], function( $ ) { + +} ); +``` + +### Node + +To include jQuery in [Node](https://nodejs.org/), first install with npm. + +```sh +npm install jquery +``` + +For jQuery to work in Node, a window with a document is required. Since no such window exists natively in Node, one can be mocked by tools such as [jsdom](https://github.com/jsdom/jsdom). This can be useful for testing purposes. + +```js +const { JSDOM } = require( "jsdom" ); +const { window } = new JSDOM( "" ); +const $ = require( "jquery" )( window ); +``` diff --git a/src/Games/Flexcode/node_modules/jquery/bower.json b/src/Games/Flexcode/node_modules/jquery/bower.json new file mode 100644 index 00000000..95798d5a --- /dev/null +++ b/src/Games/Flexcode/node_modules/jquery/bower.json @@ -0,0 +1,14 @@ +{ + "name": "jquery", + "main": "dist/jquery.js", + "license": "MIT", + "ignore": [ + "package.json" + ], + "keywords": [ + "jquery", + "javascript", + "browser", + "library" + ] +} \ No newline at end of file diff --git a/src/Games/Flexcode/node_modules/jquery/dist/jquery.js b/src/Games/Flexcode/node_modules/jquery/dist/jquery.js new file mode 100644 index 00000000..50937333 --- /dev/null +++ b/src/Games/Flexcode/node_modules/jquery/dist/jquery.js @@ -0,0 +1,10872 @@ +/*! + * jQuery JavaScript Library v3.5.1 + * https://jquery.com/ + * + * Includes Sizzle.js + * https://sizzlejs.com/ + * + * Copyright JS Foundation and other contributors + * Released under the MIT license + * https://jquery.org/license + * + * Date: 2020-05-04T22:49Z + */ +( function( global, factory ) { + + "use strict"; + + if ( typeof module === "object" && typeof module.exports === "object" ) { + + // For CommonJS and CommonJS-like environments where a proper `window` + // is present, execute the factory and get jQuery. + // For environments that do not have a `window` with a `document` + // (such as Node.js), expose a factory as module.exports. + // This accentuates the need for the creation of a real `window`. + // e.g. var jQuery = require("jquery")(window); + // See ticket #14549 for more info. + module.exports = global.document ? + factory( global, true ) : + function( w ) { + if ( !w.document ) { + throw new Error( "jQuery requires a window with a document" ); + } + return factory( w ); + }; + } else { + factory( global ); + } + +// Pass this if window is not defined yet +} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) { + +// Edge <= 12 - 13+, Firefox <=18 - 45+, IE 10 - 11, Safari 5.1 - 9+, iOS 6 - 9.1 +// throw exceptions when non-strict code (e.g., ASP.NET 4.5) accesses strict mode +// arguments.callee.caller (trac-13335). But as of jQuery 3.0 (2016), strict mode should be common +// enough that all such attempts are guarded in a try block. +"use strict"; + +var arr = []; + +var getProto = Object.getPrototypeOf; + +var slice = arr.slice; + +var flat = arr.flat ? function( array ) { + return arr.flat.call( array ); +} : function( array ) { + return arr.concat.apply( [], array ); +}; + + +var push = arr.push; + +var indexOf = arr.indexOf; + +var class2type = {}; + +var toString = class2type.toString; + +var hasOwn = class2type.hasOwnProperty; + +var fnToString = hasOwn.toString; + +var ObjectFunctionString = fnToString.call( Object ); + +var support = {}; + +var isFunction = function isFunction( obj ) { + + // Support: Chrome <=57, Firefox <=52 + // In some browsers, typeof returns "function" for HTML elements + // (i.e., `typeof document.createElement( "object" ) === "function"`). + // We don't want to classify *any* DOM node as a function. + return typeof obj === "function" && typeof obj.nodeType !== "number"; + }; + + +var isWindow = function isWindow( obj ) { + return obj != null && obj === obj.window; + }; + + +var document = window.document; + + + + var preservedScriptAttributes = { + type: true, + src: true, + nonce: true, + noModule: true + }; + + function DOMEval( code, node, doc ) { + doc = doc || document; + + var i, val, + script = doc.createElement( "script" ); + + script.text = code; + if ( node ) { + for ( i in preservedScriptAttributes ) { + + // Support: Firefox 64+, Edge 18+ + // Some browsers don't support the "nonce" property on scripts. + // On the other hand, just using `getAttribute` is not enough as + // the `nonce` attribute is reset to an empty string whenever it + // becomes browsing-context connected. + // See https://github.com/whatwg/html/issues/2369 + // See https://html.spec.whatwg.org/#nonce-attributes + // The `node.getAttribute` check was added for the sake of + // `jQuery.globalEval` so that it can fake a nonce-containing node + // via an object. + val = node[ i ] || node.getAttribute && node.getAttribute( i ); + if ( val ) { + script.setAttribute( i, val ); + } + } + } + doc.head.appendChild( script ).parentNode.removeChild( script ); + } + + +function toType( obj ) { + if ( obj == null ) { + return obj + ""; + } + + // Support: Android <=2.3 only (functionish RegExp) + return typeof obj === "object" || typeof obj === "function" ? + class2type[ toString.call( obj ) ] || "object" : + typeof obj; +} +/* global Symbol */ +// Defining this global in .eslintrc.json would create a danger of using the global +// unguarded in another place, it seems safer to define global only for this module + + + +var + version = "3.5.1", + + // Define a local copy of jQuery + jQuery = function( selector, context ) { + + // The jQuery object is actually just the init constructor 'enhanced' + // Need init if jQuery is called (just allow error to be thrown if not included) + return new jQuery.fn.init( selector, context ); + }; + +jQuery.fn = jQuery.prototype = { + + // The current version of jQuery being used + jquery: version, + + constructor: jQuery, + + // The default length of a jQuery object is 0 + length: 0, + + toArray: function() { + return slice.call( this ); + }, + + // Get the Nth element in the matched element set OR + // Get the whole matched element set as a clean array + get: function( num ) { + + // Return all the elements in a clean array + if ( num == null ) { + return slice.call( this ); + } + + // Return just the one element from the set + return num < 0 ? this[ num + this.length ] : this[ num ]; + }, + + // Take an array of elements and push it onto the stack + // (returning the new matched element set) + pushStack: function( elems ) { + + // Build a new jQuery matched element set + var ret = jQuery.merge( this.constructor(), elems ); + + // Add the old object onto the stack (as a reference) + ret.prevObject = this; + + // Return the newly-formed element set + return ret; + }, + + // Execute a callback for every element in the matched set. + each: function( callback ) { + return jQuery.each( this, callback ); + }, + + map: function( callback ) { + return this.pushStack( jQuery.map( this, function( elem, i ) { + return callback.call( elem, i, elem ); + } ) ); + }, + + slice: function() { + return this.pushStack( slice.apply( this, arguments ) ); + }, + + first: function() { + return this.eq( 0 ); + }, + + last: function() { + return this.eq( -1 ); + }, + + even: function() { + return this.pushStack( jQuery.grep( this, function( _elem, i ) { + return ( i + 1 ) % 2; + } ) ); + }, + + odd: function() { + return this.pushStack( jQuery.grep( this, function( _elem, i ) { + return i % 2; + } ) ); + }, + + eq: function( i ) { + var len = this.length, + j = +i + ( i < 0 ? len : 0 ); + return this.pushStack( j >= 0 && j < len ? [ this[ j ] ] : [] ); + }, + + end: function() { + return this.prevObject || this.constructor(); + }, + + // For internal use only. + // Behaves like an Array's method, not like a jQuery method. + push: push, + sort: arr.sort, + splice: arr.splice +}; + +jQuery.extend = jQuery.fn.extend = function() { + var options, name, src, copy, copyIsArray, clone, + target = arguments[ 0 ] || {}, + i = 1, + length = arguments.length, + deep = false; + + // Handle a deep copy situation + if ( typeof target === "boolean" ) { + deep = target; + + // Skip the boolean and the target + target = arguments[ i ] || {}; + i++; + } + + // Handle case when target is a string or something (possible in deep copy) + if ( typeof target !== "object" && !isFunction( target ) ) { + target = {}; + } + + // Extend jQuery itself if only one argument is passed + if ( i === length ) { + target = this; + i--; + } + + for ( ; i < length; i++ ) { + + // Only deal with non-null/undefined values + if ( ( options = arguments[ i ] ) != null ) { + + // Extend the base object + for ( name in options ) { + copy = options[ name ]; + + // Prevent Object.prototype pollution + // Prevent never-ending loop + if ( name === "__proto__" || target === copy ) { + continue; + } + + // Recurse if we're merging plain objects or arrays + if ( deep && copy && ( jQuery.isPlainObject( copy ) || + ( copyIsArray = Array.isArray( copy ) ) ) ) { + src = target[ name ]; + + // Ensure proper type for the source value + if ( copyIsArray && !Array.isArray( src ) ) { + clone = []; + } else if ( !copyIsArray && !jQuery.isPlainObject( src ) ) { + clone = {}; + } else { + clone = src; + } + copyIsArray = false; + + // Never move original objects, clone them + target[ name ] = jQuery.extend( deep, clone, copy ); + + // Don't bring in undefined values + } else if ( copy !== undefined ) { + target[ name ] = copy; + } + } + } + } + + // Return the modified object + return target; +}; + +jQuery.extend( { + + // Unique for each copy of jQuery on the page + expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" ), + + // Assume jQuery is ready without the ready module + isReady: true, + + error: function( msg ) { + throw new Error( msg ); + }, + + noop: function() {}, + + isPlainObject: function( obj ) { + var proto, Ctor; + + // Detect obvious negatives + // Use toString instead of jQuery.type to catch host objects + if ( !obj || toString.call( obj ) !== "[object Object]" ) { + return false; + } + + proto = getProto( obj ); + + // Objects with no prototype (e.g., `Object.create( null )`) are plain + if ( !proto ) { + return true; + } + + // Objects with prototype are plain iff they were constructed by a global Object function + Ctor = hasOwn.call( proto, "constructor" ) && proto.constructor; + return typeof Ctor === "function" && fnToString.call( Ctor ) === ObjectFunctionString; + }, + + isEmptyObject: function( obj ) { + var name; + + for ( name in obj ) { + return false; + } + return true; + }, + + // Evaluates a script in a provided context; falls back to the global one + // if not specified. + globalEval: function( code, options, doc ) { + DOMEval( code, { nonce: options && options.nonce }, doc ); + }, + + each: function( obj, callback ) { + var length, i = 0; + + if ( isArrayLike( obj ) ) { + length = obj.length; + for ( ; i < length; i++ ) { + if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) { + break; + } + } + } else { + for ( i in obj ) { + if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) { + break; + } + } + } + + return obj; + }, + + // results is for internal usage only + makeArray: function( arr, results ) { + var ret = results || []; + + if ( arr != null ) { + if ( isArrayLike( Object( arr ) ) ) { + jQuery.merge( ret, + typeof arr === "string" ? + [ arr ] : arr + ); + } else { + push.call( ret, arr ); + } + } + + return ret; + }, + + inArray: function( elem, arr, i ) { + return arr == null ? -1 : indexOf.call( arr, elem, i ); + }, + + // Support: Android <=4.0 only, PhantomJS 1 only + // push.apply(_, arraylike) throws on ancient WebKit + merge: function( first, second ) { + var len = +second.length, + j = 0, + i = first.length; + + for ( ; j < len; j++ ) { + first[ i++ ] = second[ j ]; + } + + first.length = i; + + return first; + }, + + grep: function( elems, callback, invert ) { + var callbackInverse, + matches = [], + i = 0, + length = elems.length, + callbackExpect = !invert; + + // Go through the array, only saving the items + // that pass the validator function + for ( ; i < length; i++ ) { + callbackInverse = !callback( elems[ i ], i ); + if ( callbackInverse !== callbackExpect ) { + matches.push( elems[ i ] ); + } + } + + return matches; + }, + + // arg is for internal usage only + map: function( elems, callback, arg ) { + var length, value, + i = 0, + ret = []; + + // Go through the array, translating each of the items to their new values + if ( isArrayLike( elems ) ) { + length = elems.length; + for ( ; i < length; i++ ) { + value = callback( elems[ i ], i, arg ); + + if ( value != null ) { + ret.push( value ); + } + } + + // Go through every key on the object, + } else { + for ( i in elems ) { + value = callback( elems[ i ], i, arg ); + + if ( value != null ) { + ret.push( value ); + } + } + } + + // Flatten any nested arrays + return flat( ret ); + }, + + // A global GUID counter for objects + guid: 1, + + // jQuery.support is not used in Core but other projects attach their + // properties to it so it needs to exist. + support: support +} ); + +if ( typeof Symbol === "function" ) { + jQuery.fn[ Symbol.iterator ] = arr[ Symbol.iterator ]; +} + +// Populate the class2type map +jQuery.each( "Boolean Number String Function Array Date RegExp Object Error Symbol".split( " " ), +function( _i, name ) { + class2type[ "[object " + name + "]" ] = name.toLowerCase(); +} ); + +function isArrayLike( obj ) { + + // Support: real iOS 8.2 only (not reproducible in simulator) + // `in` check used to prevent JIT error (gh-2145) + // hasOwn isn't used here due to false negatives + // regarding Nodelist length in IE + var length = !!obj && "length" in obj && obj.length, + type = toType( obj ); + + if ( isFunction( obj ) || isWindow( obj ) ) { + return false; + } + + return type === "array" || length === 0 || + typeof length === "number" && length > 0 && ( length - 1 ) in obj; +} +var Sizzle = +/*! + * Sizzle CSS Selector Engine v2.3.5 + * https://sizzlejs.com/ + * + * Copyright JS Foundation and other contributors + * Released under the MIT license + * https://js.foundation/ + * + * Date: 2020-03-14 + */ +( function( window ) { +var i, + support, + Expr, + getText, + isXML, + tokenize, + compile, + select, + outermostContext, + sortInput, + hasDuplicate, + + // Local document vars + setDocument, + document, + docElem, + documentIsHTML, + rbuggyQSA, + rbuggyMatches, + matches, + contains, + + // Instance-specific data + expando = "sizzle" + 1 * new Date(), + preferredDoc = window.document, + dirruns = 0, + done = 0, + classCache = createCache(), + tokenCache = createCache(), + compilerCache = createCache(), + nonnativeSelectorCache = createCache(), + sortOrder = function( a, b ) { + if ( a === b ) { + hasDuplicate = true; + } + return 0; + }, + + // Instance methods + hasOwn = ( {} ).hasOwnProperty, + arr = [], + pop = arr.pop, + pushNative = arr.push, + push = arr.push, + slice = arr.slice, + + // Use a stripped-down indexOf as it's faster than native + // https://jsperf.com/thor-indexof-vs-for/5 + indexOf = function( list, elem ) { + var i = 0, + len = list.length; + for ( ; i < len; i++ ) { + if ( list[ i ] === elem ) { + return i; + } + } + return -1; + }, + + booleans = "checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|" + + "ismap|loop|multiple|open|readonly|required|scoped", + + // Regular expressions + + // http://www.w3.org/TR/css3-selectors/#whitespace + whitespace = "[\\x20\\t\\r\\n\\f]", + + // https://www.w3.org/TR/css-syntax-3/#ident-token-diagram + identifier = "(?:\\\\[\\da-fA-F]{1,6}" + whitespace + + "?|\\\\[^\\r\\n\\f]|[\\w-]|[^\0-\\x7f])+", + + // Attribute selectors: http://www.w3.org/TR/selectors/#attribute-selectors + attributes = "\\[" + whitespace + "*(" + identifier + ")(?:" + whitespace + + + // Operator (capture 2) + "*([*^$|!~]?=)" + whitespace + + + // "Attribute values must be CSS identifiers [capture 5] + // or strings [capture 3 or capture 4]" + "*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|(" + identifier + "))|)" + + whitespace + "*\\]", + + pseudos = ":(" + identifier + ")(?:\\((" + + + // To reduce the number of selectors needing tokenize in the preFilter, prefer arguments: + // 1. quoted (capture 3; capture 4 or capture 5) + "('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|" + + + // 2. simple (capture 6) + "((?:\\\\.|[^\\\\()[\\]]|" + attributes + ")*)|" + + + // 3. anything else (capture 2) + ".*" + + ")\\)|)", + + // Leading and non-escaped trailing whitespace, capturing some non-whitespace characters preceding the latter + rwhitespace = new RegExp( whitespace + "+", "g" ), + rtrim = new RegExp( "^" + whitespace + "+|((?:^|[^\\\\])(?:\\\\.)*)" + + whitespace + "+$", "g" ), + + rcomma = new RegExp( "^" + whitespace + "*," + whitespace + "*" ), + rcombinators = new RegExp( "^" + whitespace + "*([>+~]|" + whitespace + ")" + whitespace + + "*" ), + rdescend = new RegExp( whitespace + "|>" ), + + rpseudo = new RegExp( pseudos ), + ridentifier = new RegExp( "^" + identifier + "$" ), + + matchExpr = { + "ID": new RegExp( "^#(" + identifier + ")" ), + "CLASS": new RegExp( "^\\.(" + identifier + ")" ), + "TAG": new RegExp( "^(" + identifier + "|[*])" ), + "ATTR": new RegExp( "^" + attributes ), + "PSEUDO": new RegExp( "^" + pseudos ), + "CHILD": new RegExp( "^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\(" + + whitespace + "*(even|odd|(([+-]|)(\\d*)n|)" + whitespace + "*(?:([+-]|)" + + whitespace + "*(\\d+)|))" + whitespace + "*\\)|)", "i" ), + "bool": new RegExp( "^(?:" + booleans + ")$", "i" ), + + // For use in libraries implementing .is() + // We use this for POS matching in `select` + "needsContext": new RegExp( "^" + whitespace + + "*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\(" + whitespace + + "*((?:-\\d)?\\d*)" + whitespace + "*\\)|)(?=[^-]|$)", "i" ) + }, + + rhtml = /HTML$/i, + rinputs = /^(?:input|select|textarea|button)$/i, + rheader = /^h\d$/i, + + rnative = /^[^{]+\{\s*\[native \w/, + + // Easily-parseable/retrievable ID or TAG or CLASS selectors + rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/, + + rsibling = /[+~]/, + + // CSS escapes + // http://www.w3.org/TR/CSS21/syndata.html#escaped-characters + runescape = new RegExp( "\\\\[\\da-fA-F]{1,6}" + whitespace + "?|\\\\([^\\r\\n\\f])", "g" ), + funescape = function( escape, nonHex ) { + var high = "0x" + escape.slice( 1 ) - 0x10000; + + return nonHex ? + + // Strip the backslash prefix from a non-hex escape sequence + nonHex : + + // Replace a hexadecimal escape sequence with the encoded Unicode code point + // Support: IE <=11+ + // For values outside the Basic Multilingual Plane (BMP), manually construct a + // surrogate pair + high < 0 ? + String.fromCharCode( high + 0x10000 ) : + String.fromCharCode( high >> 10 | 0xD800, high & 0x3FF | 0xDC00 ); + }, + + // CSS string/identifier serialization + // https://drafts.csswg.org/cssom/#common-serializing-idioms + rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g, + fcssescape = function( ch, asCodePoint ) { + if ( asCodePoint ) { + + // U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER + if ( ch === "\0" ) { + return "\uFFFD"; + } + + // Control characters and (dependent upon position) numbers get escaped as code points + return ch.slice( 0, -1 ) + "\\" + + ch.charCodeAt( ch.length - 1 ).toString( 16 ) + " "; + } + + // Other potentially-special ASCII characters get backslash-escaped + return "\\" + ch; + }, + + // Used for iframes + // See setDocument() + // Removing the function wrapper causes a "Permission Denied" + // error in IE + unloadHandler = function() { + setDocument(); + }, + + inDisabledFieldset = addCombinator( + function( elem ) { + return elem.disabled === true && elem.nodeName.toLowerCase() === "fieldset"; + }, + { dir: "parentNode", next: "legend" } + ); + +// Optimize for push.apply( _, NodeList ) +try { + push.apply( + ( arr = slice.call( preferredDoc.childNodes ) ), + preferredDoc.childNodes + ); + + // Support: Android<4.0 + // Detect silently failing push.apply + // eslint-disable-next-line no-unused-expressions + arr[ preferredDoc.childNodes.length ].nodeType; +} catch ( e ) { + push = { apply: arr.length ? + + // Leverage slice if possible + function( target, els ) { + pushNative.apply( target, slice.call( els ) ); + } : + + // Support: IE<9 + // Otherwise append directly + function( target, els ) { + var j = target.length, + i = 0; + + // Can't trust NodeList.length + while ( ( target[ j++ ] = els[ i++ ] ) ) {} + target.length = j - 1; + } + }; +} + +function Sizzle( selector, context, results, seed ) { + var m, i, elem, nid, match, groups, newSelector, + newContext = context && context.ownerDocument, + + // nodeType defaults to 9, since context defaults to document + nodeType = context ? context.nodeType : 9; + + results = results || []; + + // Return early from calls with invalid selector or context + if ( typeof selector !== "string" || !selector || + nodeType !== 1 && nodeType !== 9 && nodeType !== 11 ) { + + return results; + } + + // Try to shortcut find operations (as opposed to filters) in HTML documents + if ( !seed ) { + setDocument( context ); + context = context || document; + + if ( documentIsHTML ) { + + // If the selector is sufficiently simple, try using a "get*By*" DOM method + // (excepting DocumentFragment context, where the methods don't exist) + if ( nodeType !== 11 && ( match = rquickExpr.exec( selector ) ) ) { + + // ID selector + if ( ( m = match[ 1 ] ) ) { + + // Document context + if ( nodeType === 9 ) { + if ( ( elem = context.getElementById( m ) ) ) { + + // Support: IE, Opera, Webkit + // TODO: identify versions + // getElementById can match elements by name instead of ID + if ( elem.id === m ) { + results.push( elem ); + return results; + } + } else { + return results; + } + + // Element context + } else { + + // Support: IE, Opera, Webkit + // TODO: identify versions + // getElementById can match elements by name instead of ID + if ( newContext && ( elem = newContext.getElementById( m ) ) && + contains( context, elem ) && + elem.id === m ) { + + results.push( elem ); + return results; + } + } + + // Type selector + } else if ( match[ 2 ] ) { + push.apply( results, context.getElementsByTagName( selector ) ); + return results; + + // Class selector + } else if ( ( m = match[ 3 ] ) && support.getElementsByClassName && + context.getElementsByClassName ) { + + push.apply( results, context.getElementsByClassName( m ) ); + return results; + } + } + + // Take advantage of querySelectorAll + if ( support.qsa && + !nonnativeSelectorCache[ selector + " " ] && + ( !rbuggyQSA || !rbuggyQSA.test( selector ) ) && + + // Support: IE 8 only + // Exclude object elements + ( nodeType !== 1 || context.nodeName.toLowerCase() !== "object" ) ) { + + newSelector = selector; + newContext = context; + + // qSA considers elements outside a scoping root when evaluating child or + // descendant combinators, which is not what we want. + // In such cases, we work around the behavior by prefixing every selector in the + // list with an ID selector referencing the scope context. + // The technique has to be used as well when a leading combinator is used + // as such selectors are not recognized by querySelectorAll. + // Thanks to Andrew Dupont for this technique. + if ( nodeType === 1 && + ( rdescend.test( selector ) || rcombinators.test( selector ) ) ) { + + // Expand context for sibling selectors + newContext = rsibling.test( selector ) && testContext( context.parentNode ) || + context; + + // We can use :scope instead of the ID hack if the browser + // supports it & if we're not changing the context. + if ( newContext !== context || !support.scope ) { + + // Capture the context ID, setting it first if necessary + if ( ( nid = context.getAttribute( "id" ) ) ) { + nid = nid.replace( rcssescape, fcssescape ); + } else { + context.setAttribute( "id", ( nid = expando ) ); + } + } + + // Prefix every selector in the list + groups = tokenize( selector ); + i = groups.length; + while ( i-- ) { + groups[ i ] = ( nid ? "#" + nid : ":scope" ) + " " + + toSelector( groups[ i ] ); + } + newSelector = groups.join( "," ); + } + + try { + push.apply( results, + newContext.querySelectorAll( newSelector ) + ); + return results; + } catch ( qsaError ) { + nonnativeSelectorCache( selector, true ); + } finally { + if ( nid === expando ) { + context.removeAttribute( "id" ); + } + } + } + } + } + + // All others + return select( selector.replace( rtrim, "$1" ), context, results, seed ); +} + +/** + * Create key-value caches of limited size + * @returns {function(string, object)} Returns the Object data after storing it on itself with + * property name the (space-suffixed) string and (if the cache is larger than Expr.cacheLength) + * deleting the oldest entry + */ +function createCache() { + var keys = []; + + function cache( key, value ) { + + // Use (key + " ") to avoid collision with native prototype properties (see Issue #157) + if ( keys.push( key + " " ) > Expr.cacheLength ) { + + // Only keep the most recent entries + delete cache[ keys.shift() ]; + } + return ( cache[ key + " " ] = value ); + } + return cache; +} + +/** + * Mark a function for special use by Sizzle + * @param {Function} fn The function to mark + */ +function markFunction( fn ) { + fn[ expando ] = true; + return fn; +} + +/** + * Support testing using an element + * @param {Function} fn Passed the created element and returns a boolean result + */ +function assert( fn ) { + var el = document.createElement( "fieldset" ); + + try { + return !!fn( el ); + } catch ( e ) { + return false; + } finally { + + // Remove from its parent by default + if ( el.parentNode ) { + el.parentNode.removeChild( el ); + } + + // release memory in IE + el = null; + } +} + +/** + * Adds the same handler for all of the specified attrs + * @param {String} attrs Pipe-separated list of attributes + * @param {Function} handler The method that will be applied + */ +function addHandle( attrs, handler ) { + var arr = attrs.split( "|" ), + i = arr.length; + + while ( i-- ) { + Expr.attrHandle[ arr[ i ] ] = handler; + } +} + +/** + * Checks document order of two siblings + * @param {Element} a + * @param {Element} b + * @returns {Number} Returns less than 0 if a precedes b, greater than 0 if a follows b + */ +function siblingCheck( a, b ) { + var cur = b && a, + diff = cur && a.nodeType === 1 && b.nodeType === 1 && + a.sourceIndex - b.sourceIndex; + + // Use IE sourceIndex if available on both nodes + if ( diff ) { + return diff; + } + + // Check if b follows a + if ( cur ) { + while ( ( cur = cur.nextSibling ) ) { + if ( cur === b ) { + return -1; + } + } + } + + return a ? 1 : -1; +} + +/** + * Returns a function to use in pseudos for input types + * @param {String} type + */ +function createInputPseudo( type ) { + return function( elem ) { + var name = elem.nodeName.toLowerCase(); + return name === "input" && elem.type === type; + }; +} + +/** + * Returns a function to use in pseudos for buttons + * @param {String} type + */ +function createButtonPseudo( type ) { + return function( elem ) { + var name = elem.nodeName.toLowerCase(); + return ( name === "input" || name === "button" ) && elem.type === type; + }; +} + +/** + * Returns a function to use in pseudos for :enabled/:disabled + * @param {Boolean} disabled true for :disabled; false for :enabled + */ +function createDisabledPseudo( disabled ) { + + // Known :disabled false positives: fieldset[disabled] > legend:nth-of-type(n+2) :can-disable + return function( elem ) { + + // Only certain elements can match :enabled or :disabled + // https://html.spec.whatwg.org/multipage/scripting.html#selector-enabled + // https://html.spec.whatwg.org/multipage/scripting.html#selector-disabled + if ( "form" in elem ) { + + // Check for inherited disabledness on relevant non-disabled elements: + // * listed form-associated elements in a disabled fieldset + // https://html.spec.whatwg.org/multipage/forms.html#category-listed + // https://html.spec.whatwg.org/multipage/forms.html#concept-fe-disabled + // * option elements in a disabled optgroup + // https://html.spec.whatwg.org/multipage/forms.html#concept-option-disabled + // All such elements have a "form" property. + if ( elem.parentNode && elem.disabled === false ) { + + // Option elements defer to a parent optgroup if present + if ( "label" in elem ) { + if ( "label" in elem.parentNode ) { + return elem.parentNode.disabled === disabled; + } else { + return elem.disabled === disabled; + } + } + + // Support: IE 6 - 11 + // Use the isDisabled shortcut property to check for disabled fieldset ancestors + return elem.isDisabled === disabled || + + // Where there is no isDisabled, check manually + /* jshint -W018 */ + elem.isDisabled !== !disabled && + inDisabledFieldset( elem ) === disabled; + } + + return elem.disabled === disabled; + + // Try to winnow out elements that can't be disabled before trusting the disabled property. + // Some victims get caught in our net (label, legend, menu, track), but it shouldn't + // even exist on them, let alone have a boolean value. + } else if ( "label" in elem ) { + return elem.disabled === disabled; + } + + // Remaining elements are neither :enabled nor :disabled + return false; + }; +} + +/** + * Returns a function to use in pseudos for positionals + * @param {Function} fn + */ +function createPositionalPseudo( fn ) { + return markFunction( function( argument ) { + argument = +argument; + return markFunction( function( seed, matches ) { + var j, + matchIndexes = fn( [], seed.length, argument ), + i = matchIndexes.length; + + // Match elements found at the specified indexes + while ( i-- ) { + if ( seed[ ( j = matchIndexes[ i ] ) ] ) { + seed[ j ] = !( matches[ j ] = seed[ j ] ); + } + } + } ); + } ); +} + +/** + * Checks a node for validity as a Sizzle context + * @param {Element|Object=} context + * @returns {Element|Object|Boolean} The input node if acceptable, otherwise a falsy value + */ +function testContext( context ) { + return context && typeof context.getElementsByTagName !== "undefined" && context; +} + +// Expose support vars for convenience +support = Sizzle.support = {}; + +/** + * Detects XML nodes + * @param {Element|Object} elem An element or a document + * @returns {Boolean} True iff elem is a non-HTML XML node + */ +isXML = Sizzle.isXML = function( elem ) { + var namespace = elem.namespaceURI, + docElem = ( elem.ownerDocument || elem ).documentElement; + + // Support: IE <=8 + // Assume HTML when documentElement doesn't yet exist, such as inside loading iframes + // https://bugs.jquery.com/ticket/4833 + return !rhtml.test( namespace || docElem && docElem.nodeName || "HTML" ); +}; + +/** + * Sets document-related variables once based on the current document + * @param {Element|Object} [doc] An element or document object to use to set the document + * @returns {Object} Returns the current document + */ +setDocument = Sizzle.setDocument = function( node ) { + var hasCompare, subWindow, + doc = node ? node.ownerDocument || node : preferredDoc; + + // Return early if doc is invalid or already selected + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( doc == document || doc.nodeType !== 9 || !doc.documentElement ) { + return document; + } + + // Update global variables + document = doc; + docElem = document.documentElement; + documentIsHTML = !isXML( document ); + + // Support: IE 9 - 11+, Edge 12 - 18+ + // Accessing iframe documents after unload throws "permission denied" errors (jQuery #13936) + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( preferredDoc != document && + ( subWindow = document.defaultView ) && subWindow.top !== subWindow ) { + + // Support: IE 11, Edge + if ( subWindow.addEventListener ) { + subWindow.addEventListener( "unload", unloadHandler, false ); + + // Support: IE 9 - 10 only + } else if ( subWindow.attachEvent ) { + subWindow.attachEvent( "onunload", unloadHandler ); + } + } + + // Support: IE 8 - 11+, Edge 12 - 18+, Chrome <=16 - 25 only, Firefox <=3.6 - 31 only, + // Safari 4 - 5 only, Opera <=11.6 - 12.x only + // IE/Edge & older browsers don't support the :scope pseudo-class. + // Support: Safari 6.0 only + // Safari 6.0 supports :scope but it's an alias of :root there. + support.scope = assert( function( el ) { + docElem.appendChild( el ).appendChild( document.createElement( "div" ) ); + return typeof el.querySelectorAll !== "undefined" && + !el.querySelectorAll( ":scope fieldset div" ).length; + } ); + + /* Attributes + ---------------------------------------------------------------------- */ + + // Support: IE<8 + // Verify that getAttribute really returns attributes and not properties + // (excepting IE8 booleans) + support.attributes = assert( function( el ) { + el.className = "i"; + return !el.getAttribute( "className" ); + } ); + + /* getElement(s)By* + ---------------------------------------------------------------------- */ + + // Check if getElementsByTagName("*") returns only elements + support.getElementsByTagName = assert( function( el ) { + el.appendChild( document.createComment( "" ) ); + return !el.getElementsByTagName( "*" ).length; + } ); + + // Support: IE<9 + support.getElementsByClassName = rnative.test( document.getElementsByClassName ); + + // Support: IE<10 + // Check if getElementById returns elements by name + // The broken getElementById methods don't pick up programmatically-set names, + // so use a roundabout getElementsByName test + support.getById = assert( function( el ) { + docElem.appendChild( el ).id = expando; + return !document.getElementsByName || !document.getElementsByName( expando ).length; + } ); + + // ID filter and find + if ( support.getById ) { + Expr.filter[ "ID" ] = function( id ) { + var attrId = id.replace( runescape, funescape ); + return function( elem ) { + return elem.getAttribute( "id" ) === attrId; + }; + }; + Expr.find[ "ID" ] = function( id, context ) { + if ( typeof context.getElementById !== "undefined" && documentIsHTML ) { + var elem = context.getElementById( id ); + return elem ? [ elem ] : []; + } + }; + } else { + Expr.filter[ "ID" ] = function( id ) { + var attrId = id.replace( runescape, funescape ); + return function( elem ) { + var node = typeof elem.getAttributeNode !== "undefined" && + elem.getAttributeNode( "id" ); + return node && node.value === attrId; + }; + }; + + // Support: IE 6 - 7 only + // getElementById is not reliable as a find shortcut + Expr.find[ "ID" ] = function( id, context ) { + if ( typeof context.getElementById !== "undefined" && documentIsHTML ) { + var node, i, elems, + elem = context.getElementById( id ); + + if ( elem ) { + + // Verify the id attribute + node = elem.getAttributeNode( "id" ); + if ( node && node.value === id ) { + return [ elem ]; + } + + // Fall back on getElementsByName + elems = context.getElementsByName( id ); + i = 0; + while ( ( elem = elems[ i++ ] ) ) { + node = elem.getAttributeNode( "id" ); + if ( node && node.value === id ) { + return [ elem ]; + } + } + } + + return []; + } + }; + } + + // Tag + Expr.find[ "TAG" ] = support.getElementsByTagName ? + function( tag, context ) { + if ( typeof context.getElementsByTagName !== "undefined" ) { + return context.getElementsByTagName( tag ); + + // DocumentFragment nodes don't have gEBTN + } else if ( support.qsa ) { + return context.querySelectorAll( tag ); + } + } : + + function( tag, context ) { + var elem, + tmp = [], + i = 0, + + // By happy coincidence, a (broken) gEBTN appears on DocumentFragment nodes too + results = context.getElementsByTagName( tag ); + + // Filter out possible comments + if ( tag === "*" ) { + while ( ( elem = results[ i++ ] ) ) { + if ( elem.nodeType === 1 ) { + tmp.push( elem ); + } + } + + return tmp; + } + return results; + }; + + // Class + Expr.find[ "CLASS" ] = support.getElementsByClassName && function( className, context ) { + if ( typeof context.getElementsByClassName !== "undefined" && documentIsHTML ) { + return context.getElementsByClassName( className ); + } + }; + + /* QSA/matchesSelector + ---------------------------------------------------------------------- */ + + // QSA and matchesSelector support + + // matchesSelector(:active) reports false when true (IE9/Opera 11.5) + rbuggyMatches = []; + + // qSa(:focus) reports false when true (Chrome 21) + // We allow this because of a bug in IE8/9 that throws an error + // whenever `document.activeElement` is accessed on an iframe + // So, we allow :focus to pass through QSA all the time to avoid the IE error + // See https://bugs.jquery.com/ticket/13378 + rbuggyQSA = []; + + if ( ( support.qsa = rnative.test( document.querySelectorAll ) ) ) { + + // Build QSA regex + // Regex strategy adopted from Diego Perini + assert( function( el ) { + + var input; + + // Select is set to empty string on purpose + // This is to test IE's treatment of not explicitly + // setting a boolean content attribute, + // since its presence should be enough + // https://bugs.jquery.com/ticket/12359 + docElem.appendChild( el ).innerHTML = "" + + ""; + + // Support: IE8, Opera 11-12.16 + // Nothing should be selected when empty strings follow ^= or $= or *= + // The test attribute must be unknown in Opera but "safe" for WinRT + // https://msdn.microsoft.com/en-us/library/ie/hh465388.aspx#attribute_section + if ( el.querySelectorAll( "[msallowcapture^='']" ).length ) { + rbuggyQSA.push( "[*^$]=" + whitespace + "*(?:''|\"\")" ); + } + + // Support: IE8 + // Boolean attributes and "value" are not treated correctly + if ( !el.querySelectorAll( "[selected]" ).length ) { + rbuggyQSA.push( "\\[" + whitespace + "*(?:value|" + booleans + ")" ); + } + + // Support: Chrome<29, Android<4.4, Safari<7.0+, iOS<7.0+, PhantomJS<1.9.8+ + if ( !el.querySelectorAll( "[id~=" + expando + "-]" ).length ) { + rbuggyQSA.push( "~=" ); + } + + // Support: IE 11+, Edge 15 - 18+ + // IE 11/Edge don't find elements on a `[name='']` query in some cases. + // Adding a temporary attribute to the document before the selection works + // around the issue. + // Interestingly, IE 10 & older don't seem to have the issue. + input = document.createElement( "input" ); + input.setAttribute( "name", "" ); + el.appendChild( input ); + if ( !el.querySelectorAll( "[name='']" ).length ) { + rbuggyQSA.push( "\\[" + whitespace + "*name" + whitespace + "*=" + + whitespace + "*(?:''|\"\")" ); + } + + // Webkit/Opera - :checked should return selected option elements + // http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked + // IE8 throws error here and will not see later tests + if ( !el.querySelectorAll( ":checked" ).length ) { + rbuggyQSA.push( ":checked" ); + } + + // Support: Safari 8+, iOS 8+ + // https://bugs.webkit.org/show_bug.cgi?id=136851 + // In-page `selector#id sibling-combinator selector` fails + if ( !el.querySelectorAll( "a#" + expando + "+*" ).length ) { + rbuggyQSA.push( ".#.+[+~]" ); + } + + // Support: Firefox <=3.6 - 5 only + // Old Firefox doesn't throw on a badly-escaped identifier. + el.querySelectorAll( "\\\f" ); + rbuggyQSA.push( "[\\r\\n\\f]" ); + } ); + + assert( function( el ) { + el.innerHTML = "" + + ""; + + // Support: Windows 8 Native Apps + // The type and name attributes are restricted during .innerHTML assignment + var input = document.createElement( "input" ); + input.setAttribute( "type", "hidden" ); + el.appendChild( input ).setAttribute( "name", "D" ); + + // Support: IE8 + // Enforce case-sensitivity of name attribute + if ( el.querySelectorAll( "[name=d]" ).length ) { + rbuggyQSA.push( "name" + whitespace + "*[*^$|!~]?=" ); + } + + // FF 3.5 - :enabled/:disabled and hidden elements (hidden elements are still enabled) + // IE8 throws error here and will not see later tests + if ( el.querySelectorAll( ":enabled" ).length !== 2 ) { + rbuggyQSA.push( ":enabled", ":disabled" ); + } + + // Support: IE9-11+ + // IE's :disabled selector does not pick up the children of disabled fieldsets + docElem.appendChild( el ).disabled = true; + if ( el.querySelectorAll( ":disabled" ).length !== 2 ) { + rbuggyQSA.push( ":enabled", ":disabled" ); + } + + // Support: Opera 10 - 11 only + // Opera 10-11 does not throw on post-comma invalid pseudos + el.querySelectorAll( "*,:x" ); + rbuggyQSA.push( ",.*:" ); + } ); + } + + if ( ( support.matchesSelector = rnative.test( ( matches = docElem.matches || + docElem.webkitMatchesSelector || + docElem.mozMatchesSelector || + docElem.oMatchesSelector || + docElem.msMatchesSelector ) ) ) ) { + + assert( function( el ) { + + // Check to see if it's possible to do matchesSelector + // on a disconnected node (IE 9) + support.disconnectedMatch = matches.call( el, "*" ); + + // This should fail with an exception + // Gecko does not error, returns false instead + matches.call( el, "[s!='']:x" ); + rbuggyMatches.push( "!=", pseudos ); + } ); + } + + rbuggyQSA = rbuggyQSA.length && new RegExp( rbuggyQSA.join( "|" ) ); + rbuggyMatches = rbuggyMatches.length && new RegExp( rbuggyMatches.join( "|" ) ); + + /* Contains + ---------------------------------------------------------------------- */ + hasCompare = rnative.test( docElem.compareDocumentPosition ); + + // Element contains another + // Purposefully self-exclusive + // As in, an element does not contain itself + contains = hasCompare || rnative.test( docElem.contains ) ? + function( a, b ) { + var adown = a.nodeType === 9 ? a.documentElement : a, + bup = b && b.parentNode; + return a === bup || !!( bup && bup.nodeType === 1 && ( + adown.contains ? + adown.contains( bup ) : + a.compareDocumentPosition && a.compareDocumentPosition( bup ) & 16 + ) ); + } : + function( a, b ) { + if ( b ) { + while ( ( b = b.parentNode ) ) { + if ( b === a ) { + return true; + } + } + } + return false; + }; + + /* Sorting + ---------------------------------------------------------------------- */ + + // Document order sorting + sortOrder = hasCompare ? + function( a, b ) { + + // Flag for duplicate removal + if ( a === b ) { + hasDuplicate = true; + return 0; + } + + // Sort on method existence if only one input has compareDocumentPosition + var compare = !a.compareDocumentPosition - !b.compareDocumentPosition; + if ( compare ) { + return compare; + } + + // Calculate position if both inputs belong to the same document + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + compare = ( a.ownerDocument || a ) == ( b.ownerDocument || b ) ? + a.compareDocumentPosition( b ) : + + // Otherwise we know they are disconnected + 1; + + // Disconnected nodes + if ( compare & 1 || + ( !support.sortDetached && b.compareDocumentPosition( a ) === compare ) ) { + + // Choose the first element that is related to our preferred document + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( a == document || a.ownerDocument == preferredDoc && + contains( preferredDoc, a ) ) { + return -1; + } + + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( b == document || b.ownerDocument == preferredDoc && + contains( preferredDoc, b ) ) { + return 1; + } + + // Maintain original order + return sortInput ? + ( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) : + 0; + } + + return compare & 4 ? -1 : 1; + } : + function( a, b ) { + + // Exit early if the nodes are identical + if ( a === b ) { + hasDuplicate = true; + return 0; + } + + var cur, + i = 0, + aup = a.parentNode, + bup = b.parentNode, + ap = [ a ], + bp = [ b ]; + + // Parentless nodes are either documents or disconnected + if ( !aup || !bup ) { + + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + /* eslint-disable eqeqeq */ + return a == document ? -1 : + b == document ? 1 : + /* eslint-enable eqeqeq */ + aup ? -1 : + bup ? 1 : + sortInput ? + ( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) : + 0; + + // If the nodes are siblings, we can do a quick check + } else if ( aup === bup ) { + return siblingCheck( a, b ); + } + + // Otherwise we need full lists of their ancestors for comparison + cur = a; + while ( ( cur = cur.parentNode ) ) { + ap.unshift( cur ); + } + cur = b; + while ( ( cur = cur.parentNode ) ) { + bp.unshift( cur ); + } + + // Walk down the tree looking for a discrepancy + while ( ap[ i ] === bp[ i ] ) { + i++; + } + + return i ? + + // Do a sibling check if the nodes have a common ancestor + siblingCheck( ap[ i ], bp[ i ] ) : + + // Otherwise nodes in our document sort first + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + /* eslint-disable eqeqeq */ + ap[ i ] == preferredDoc ? -1 : + bp[ i ] == preferredDoc ? 1 : + /* eslint-enable eqeqeq */ + 0; + }; + + return document; +}; + +Sizzle.matches = function( expr, elements ) { + return Sizzle( expr, null, null, elements ); +}; + +Sizzle.matchesSelector = function( elem, expr ) { + setDocument( elem ); + + if ( support.matchesSelector && documentIsHTML && + !nonnativeSelectorCache[ expr + " " ] && + ( !rbuggyMatches || !rbuggyMatches.test( expr ) ) && + ( !rbuggyQSA || !rbuggyQSA.test( expr ) ) ) { + + try { + var ret = matches.call( elem, expr ); + + // IE 9's matchesSelector returns false on disconnected nodes + if ( ret || support.disconnectedMatch || + + // As well, disconnected nodes are said to be in a document + // fragment in IE 9 + elem.document && elem.document.nodeType !== 11 ) { + return ret; + } + } catch ( e ) { + nonnativeSelectorCache( expr, true ); + } + } + + return Sizzle( expr, document, null, [ elem ] ).length > 0; +}; + +Sizzle.contains = function( context, elem ) { + + // Set document vars if needed + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( ( context.ownerDocument || context ) != document ) { + setDocument( context ); + } + return contains( context, elem ); +}; + +Sizzle.attr = function( elem, name ) { + + // Set document vars if needed + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( ( elem.ownerDocument || elem ) != document ) { + setDocument( elem ); + } + + var fn = Expr.attrHandle[ name.toLowerCase() ], + + // Don't get fooled by Object.prototype properties (jQuery #13807) + val = fn && hasOwn.call( Expr.attrHandle, name.toLowerCase() ) ? + fn( elem, name, !documentIsHTML ) : + undefined; + + return val !== undefined ? + val : + support.attributes || !documentIsHTML ? + elem.getAttribute( name ) : + ( val = elem.getAttributeNode( name ) ) && val.specified ? + val.value : + null; +}; + +Sizzle.escape = function( sel ) { + return ( sel + "" ).replace( rcssescape, fcssescape ); +}; + +Sizzle.error = function( msg ) { + throw new Error( "Syntax error, unrecognized expression: " + msg ); +}; + +/** + * Document sorting and removing duplicates + * @param {ArrayLike} results + */ +Sizzle.uniqueSort = function( results ) { + var elem, + duplicates = [], + j = 0, + i = 0; + + // Unless we *know* we can detect duplicates, assume their presence + hasDuplicate = !support.detectDuplicates; + sortInput = !support.sortStable && results.slice( 0 ); + results.sort( sortOrder ); + + if ( hasDuplicate ) { + while ( ( elem = results[ i++ ] ) ) { + if ( elem === results[ i ] ) { + j = duplicates.push( i ); + } + } + while ( j-- ) { + results.splice( duplicates[ j ], 1 ); + } + } + + // Clear input after sorting to release objects + // See https://github.com/jquery/sizzle/pull/225 + sortInput = null; + + return results; +}; + +/** + * Utility function for retrieving the text value of an array of DOM nodes + * @param {Array|Element} elem + */ +getText = Sizzle.getText = function( elem ) { + var node, + ret = "", + i = 0, + nodeType = elem.nodeType; + + if ( !nodeType ) { + + // If no nodeType, this is expected to be an array + while ( ( node = elem[ i++ ] ) ) { + + // Do not traverse comment nodes + ret += getText( node ); + } + } else if ( nodeType === 1 || nodeType === 9 || nodeType === 11 ) { + + // Use textContent for elements + // innerText usage removed for consistency of new lines (jQuery #11153) + if ( typeof elem.textContent === "string" ) { + return elem.textContent; + } else { + + // Traverse its children + for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) { + ret += getText( elem ); + } + } + } else if ( nodeType === 3 || nodeType === 4 ) { + return elem.nodeValue; + } + + // Do not include comment or processing instruction nodes + + return ret; +}; + +Expr = Sizzle.selectors = { + + // Can be adjusted by the user + cacheLength: 50, + + createPseudo: markFunction, + + match: matchExpr, + + attrHandle: {}, + + find: {}, + + relative: { + ">": { dir: "parentNode", first: true }, + " ": { dir: "parentNode" }, + "+": { dir: "previousSibling", first: true }, + "~": { dir: "previousSibling" } + }, + + preFilter: { + "ATTR": function( match ) { + match[ 1 ] = match[ 1 ].replace( runescape, funescape ); + + // Move the given value to match[3] whether quoted or unquoted + match[ 3 ] = ( match[ 3 ] || match[ 4 ] || + match[ 5 ] || "" ).replace( runescape, funescape ); + + if ( match[ 2 ] === "~=" ) { + match[ 3 ] = " " + match[ 3 ] + " "; + } + + return match.slice( 0, 4 ); + }, + + "CHILD": function( match ) { + + /* matches from matchExpr["CHILD"] + 1 type (only|nth|...) + 2 what (child|of-type) + 3 argument (even|odd|\d*|\d*n([+-]\d+)?|...) + 4 xn-component of xn+y argument ([+-]?\d*n|) + 5 sign of xn-component + 6 x of xn-component + 7 sign of y-component + 8 y of y-component + */ + match[ 1 ] = match[ 1 ].toLowerCase(); + + if ( match[ 1 ].slice( 0, 3 ) === "nth" ) { + + // nth-* requires argument + if ( !match[ 3 ] ) { + Sizzle.error( match[ 0 ] ); + } + + // numeric x and y parameters for Expr.filter.CHILD + // remember that false/true cast respectively to 0/1 + match[ 4 ] = +( match[ 4 ] ? + match[ 5 ] + ( match[ 6 ] || 1 ) : + 2 * ( match[ 3 ] === "even" || match[ 3 ] === "odd" ) ); + match[ 5 ] = +( ( match[ 7 ] + match[ 8 ] ) || match[ 3 ] === "odd" ); + + // other types prohibit arguments + } else if ( match[ 3 ] ) { + Sizzle.error( match[ 0 ] ); + } + + return match; + }, + + "PSEUDO": function( match ) { + var excess, + unquoted = !match[ 6 ] && match[ 2 ]; + + if ( matchExpr[ "CHILD" ].test( match[ 0 ] ) ) { + return null; + } + + // Accept quoted arguments as-is + if ( match[ 3 ] ) { + match[ 2 ] = match[ 4 ] || match[ 5 ] || ""; + + // Strip excess characters from unquoted arguments + } else if ( unquoted && rpseudo.test( unquoted ) && + + // Get excess from tokenize (recursively) + ( excess = tokenize( unquoted, true ) ) && + + // advance to the next closing parenthesis + ( excess = unquoted.indexOf( ")", unquoted.length - excess ) - unquoted.length ) ) { + + // excess is a negative index + match[ 0 ] = match[ 0 ].slice( 0, excess ); + match[ 2 ] = unquoted.slice( 0, excess ); + } + + // Return only captures needed by the pseudo filter method (type and argument) + return match.slice( 0, 3 ); + } + }, + + filter: { + + "TAG": function( nodeNameSelector ) { + var nodeName = nodeNameSelector.replace( runescape, funescape ).toLowerCase(); + return nodeNameSelector === "*" ? + function() { + return true; + } : + function( elem ) { + return elem.nodeName && elem.nodeName.toLowerCase() === nodeName; + }; + }, + + "CLASS": function( className ) { + var pattern = classCache[ className + " " ]; + + return pattern || + ( pattern = new RegExp( "(^|" + whitespace + + ")" + className + "(" + whitespace + "|$)" ) ) && classCache( + className, function( elem ) { + return pattern.test( + typeof elem.className === "string" && elem.className || + typeof elem.getAttribute !== "undefined" && + elem.getAttribute( "class" ) || + "" + ); + } ); + }, + + "ATTR": function( name, operator, check ) { + return function( elem ) { + var result = Sizzle.attr( elem, name ); + + if ( result == null ) { + return operator === "!="; + } + if ( !operator ) { + return true; + } + + result += ""; + + /* eslint-disable max-len */ + + return operator === "=" ? result === check : + operator === "!=" ? result !== check : + operator === "^=" ? check && result.indexOf( check ) === 0 : + operator === "*=" ? check && result.indexOf( check ) > -1 : + operator === "$=" ? check && result.slice( -check.length ) === check : + operator === "~=" ? ( " " + result.replace( rwhitespace, " " ) + " " ).indexOf( check ) > -1 : + operator === "|=" ? result === check || result.slice( 0, check.length + 1 ) === check + "-" : + false; + /* eslint-enable max-len */ + + }; + }, + + "CHILD": function( type, what, _argument, first, last ) { + var simple = type.slice( 0, 3 ) !== "nth", + forward = type.slice( -4 ) !== "last", + ofType = what === "of-type"; + + return first === 1 && last === 0 ? + + // Shortcut for :nth-*(n) + function( elem ) { + return !!elem.parentNode; + } : + + function( elem, _context, xml ) { + var cache, uniqueCache, outerCache, node, nodeIndex, start, + dir = simple !== forward ? "nextSibling" : "previousSibling", + parent = elem.parentNode, + name = ofType && elem.nodeName.toLowerCase(), + useCache = !xml && !ofType, + diff = false; + + if ( parent ) { + + // :(first|last|only)-(child|of-type) + if ( simple ) { + while ( dir ) { + node = elem; + while ( ( node = node[ dir ] ) ) { + if ( ofType ? + node.nodeName.toLowerCase() === name : + node.nodeType === 1 ) { + + return false; + } + } + + // Reverse direction for :only-* (if we haven't yet done so) + start = dir = type === "only" && !start && "nextSibling"; + } + return true; + } + + start = [ forward ? parent.firstChild : parent.lastChild ]; + + // non-xml :nth-child(...) stores cache data on `parent` + if ( forward && useCache ) { + + // Seek `elem` from a previously-cached index + + // ...in a gzip-friendly way + node = parent; + outerCache = node[ expando ] || ( node[ expando ] = {} ); + + // Support: IE <9 only + // Defend against cloned attroperties (jQuery gh-1709) + uniqueCache = outerCache[ node.uniqueID ] || + ( outerCache[ node.uniqueID ] = {} ); + + cache = uniqueCache[ type ] || []; + nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ]; + diff = nodeIndex && cache[ 2 ]; + node = nodeIndex && parent.childNodes[ nodeIndex ]; + + while ( ( node = ++nodeIndex && node && node[ dir ] || + + // Fallback to seeking `elem` from the start + ( diff = nodeIndex = 0 ) || start.pop() ) ) { + + // When found, cache indexes on `parent` and break + if ( node.nodeType === 1 && ++diff && node === elem ) { + uniqueCache[ type ] = [ dirruns, nodeIndex, diff ]; + break; + } + } + + } else { + + // Use previously-cached element index if available + if ( useCache ) { + + // ...in a gzip-friendly way + node = elem; + outerCache = node[ expando ] || ( node[ expando ] = {} ); + + // Support: IE <9 only + // Defend against cloned attroperties (jQuery gh-1709) + uniqueCache = outerCache[ node.uniqueID ] || + ( outerCache[ node.uniqueID ] = {} ); + + cache = uniqueCache[ type ] || []; + nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ]; + diff = nodeIndex; + } + + // xml :nth-child(...) + // or :nth-last-child(...) or :nth(-last)?-of-type(...) + if ( diff === false ) { + + // Use the same loop as above to seek `elem` from the start + while ( ( node = ++nodeIndex && node && node[ dir ] || + ( diff = nodeIndex = 0 ) || start.pop() ) ) { + + if ( ( ofType ? + node.nodeName.toLowerCase() === name : + node.nodeType === 1 ) && + ++diff ) { + + // Cache the index of each encountered element + if ( useCache ) { + outerCache = node[ expando ] || + ( node[ expando ] = {} ); + + // Support: IE <9 only + // Defend against cloned attroperties (jQuery gh-1709) + uniqueCache = outerCache[ node.uniqueID ] || + ( outerCache[ node.uniqueID ] = {} ); + + uniqueCache[ type ] = [ dirruns, diff ]; + } + + if ( node === elem ) { + break; + } + } + } + } + } + + // Incorporate the offset, then check against cycle size + diff -= last; + return diff === first || ( diff % first === 0 && diff / first >= 0 ); + } + }; + }, + + "PSEUDO": function( pseudo, argument ) { + + // pseudo-class names are case-insensitive + // http://www.w3.org/TR/selectors/#pseudo-classes + // Prioritize by case sensitivity in case custom pseudos are added with uppercase letters + // Remember that setFilters inherits from pseudos + var args, + fn = Expr.pseudos[ pseudo ] || Expr.setFilters[ pseudo.toLowerCase() ] || + Sizzle.error( "unsupported pseudo: " + pseudo ); + + // The user may use createPseudo to indicate that + // arguments are needed to create the filter function + // just as Sizzle does + if ( fn[ expando ] ) { + return fn( argument ); + } + + // But maintain support for old signatures + if ( fn.length > 1 ) { + args = [ pseudo, pseudo, "", argument ]; + return Expr.setFilters.hasOwnProperty( pseudo.toLowerCase() ) ? + markFunction( function( seed, matches ) { + var idx, + matched = fn( seed, argument ), + i = matched.length; + while ( i-- ) { + idx = indexOf( seed, matched[ i ] ); + seed[ idx ] = !( matches[ idx ] = matched[ i ] ); + } + } ) : + function( elem ) { + return fn( elem, 0, args ); + }; + } + + return fn; + } + }, + + pseudos: { + + // Potentially complex pseudos + "not": markFunction( function( selector ) { + + // Trim the selector passed to compile + // to avoid treating leading and trailing + // spaces as combinators + var input = [], + results = [], + matcher = compile( selector.replace( rtrim, "$1" ) ); + + return matcher[ expando ] ? + markFunction( function( seed, matches, _context, xml ) { + var elem, + unmatched = matcher( seed, null, xml, [] ), + i = seed.length; + + // Match elements unmatched by `matcher` + while ( i-- ) { + if ( ( elem = unmatched[ i ] ) ) { + seed[ i ] = !( matches[ i ] = elem ); + } + } + } ) : + function( elem, _context, xml ) { + input[ 0 ] = elem; + matcher( input, null, xml, results ); + + // Don't keep the element (issue #299) + input[ 0 ] = null; + return !results.pop(); + }; + } ), + + "has": markFunction( function( selector ) { + return function( elem ) { + return Sizzle( selector, elem ).length > 0; + }; + } ), + + "contains": markFunction( function( text ) { + text = text.replace( runescape, funescape ); + return function( elem ) { + return ( elem.textContent || getText( elem ) ).indexOf( text ) > -1; + }; + } ), + + // "Whether an element is represented by a :lang() selector + // is based solely on the element's language value + // being equal to the identifier C, + // or beginning with the identifier C immediately followed by "-". + // The matching of C against the element's language value is performed case-insensitively. + // The identifier C does not have to be a valid language name." + // http://www.w3.org/TR/selectors/#lang-pseudo + "lang": markFunction( function( lang ) { + + // lang value must be a valid identifier + if ( !ridentifier.test( lang || "" ) ) { + Sizzle.error( "unsupported lang: " + lang ); + } + lang = lang.replace( runescape, funescape ).toLowerCase(); + return function( elem ) { + var elemLang; + do { + if ( ( elemLang = documentIsHTML ? + elem.lang : + elem.getAttribute( "xml:lang" ) || elem.getAttribute( "lang" ) ) ) { + + elemLang = elemLang.toLowerCase(); + return elemLang === lang || elemLang.indexOf( lang + "-" ) === 0; + } + } while ( ( elem = elem.parentNode ) && elem.nodeType === 1 ); + return false; + }; + } ), + + // Miscellaneous + "target": function( elem ) { + var hash = window.location && window.location.hash; + return hash && hash.slice( 1 ) === elem.id; + }, + + "root": function( elem ) { + return elem === docElem; + }, + + "focus": function( elem ) { + return elem === document.activeElement && + ( !document.hasFocus || document.hasFocus() ) && + !!( elem.type || elem.href || ~elem.tabIndex ); + }, + + // Boolean properties + "enabled": createDisabledPseudo( false ), + "disabled": createDisabledPseudo( true ), + + "checked": function( elem ) { + + // In CSS3, :checked should return both checked and selected elements + // http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked + var nodeName = elem.nodeName.toLowerCase(); + return ( nodeName === "input" && !!elem.checked ) || + ( nodeName === "option" && !!elem.selected ); + }, + + "selected": function( elem ) { + + // Accessing this property makes selected-by-default + // options in Safari work properly + if ( elem.parentNode ) { + // eslint-disable-next-line no-unused-expressions + elem.parentNode.selectedIndex; + } + + return elem.selected === true; + }, + + // Contents + "empty": function( elem ) { + + // http://www.w3.org/TR/selectors/#empty-pseudo + // :empty is negated by element (1) or content nodes (text: 3; cdata: 4; entity ref: 5), + // but not by others (comment: 8; processing instruction: 7; etc.) + // nodeType < 6 works because attributes (2) do not appear as children + for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) { + if ( elem.nodeType < 6 ) { + return false; + } + } + return true; + }, + + "parent": function( elem ) { + return !Expr.pseudos[ "empty" ]( elem ); + }, + + // Element/input types + "header": function( elem ) { + return rheader.test( elem.nodeName ); + }, + + "input": function( elem ) { + return rinputs.test( elem.nodeName ); + }, + + "button": function( elem ) { + var name = elem.nodeName.toLowerCase(); + return name === "input" && elem.type === "button" || name === "button"; + }, + + "text": function( elem ) { + var attr; + return elem.nodeName.toLowerCase() === "input" && + elem.type === "text" && + + // Support: IE<8 + // New HTML5 attribute values (e.g., "search") appear with elem.type === "text" + ( ( attr = elem.getAttribute( "type" ) ) == null || + attr.toLowerCase() === "text" ); + }, + + // Position-in-collection + "first": createPositionalPseudo( function() { + return [ 0 ]; + } ), + + "last": createPositionalPseudo( function( _matchIndexes, length ) { + return [ length - 1 ]; + } ), + + "eq": createPositionalPseudo( function( _matchIndexes, length, argument ) { + return [ argument < 0 ? argument + length : argument ]; + } ), + + "even": createPositionalPseudo( function( matchIndexes, length ) { + var i = 0; + for ( ; i < length; i += 2 ) { + matchIndexes.push( i ); + } + return matchIndexes; + } ), + + "odd": createPositionalPseudo( function( matchIndexes, length ) { + var i = 1; + for ( ; i < length; i += 2 ) { + matchIndexes.push( i ); + } + return matchIndexes; + } ), + + "lt": createPositionalPseudo( function( matchIndexes, length, argument ) { + var i = argument < 0 ? + argument + length : + argument > length ? + length : + argument; + for ( ; --i >= 0; ) { + matchIndexes.push( i ); + } + return matchIndexes; + } ), + + "gt": createPositionalPseudo( function( matchIndexes, length, argument ) { + var i = argument < 0 ? argument + length : argument; + for ( ; ++i < length; ) { + matchIndexes.push( i ); + } + return matchIndexes; + } ) + } +}; + +Expr.pseudos[ "nth" ] = Expr.pseudos[ "eq" ]; + +// Add button/input type pseudos +for ( i in { radio: true, checkbox: true, file: true, password: true, image: true } ) { + Expr.pseudos[ i ] = createInputPseudo( i ); +} +for ( i in { submit: true, reset: true } ) { + Expr.pseudos[ i ] = createButtonPseudo( i ); +} + +// Easy API for creating new setFilters +function setFilters() {} +setFilters.prototype = Expr.filters = Expr.pseudos; +Expr.setFilters = new setFilters(); + +tokenize = Sizzle.tokenize = function( selector, parseOnly ) { + var matched, match, tokens, type, + soFar, groups, preFilters, + cached = tokenCache[ selector + " " ]; + + if ( cached ) { + return parseOnly ? 0 : cached.slice( 0 ); + } + + soFar = selector; + groups = []; + preFilters = Expr.preFilter; + + while ( soFar ) { + + // Comma and first run + if ( !matched || ( match = rcomma.exec( soFar ) ) ) { + if ( match ) { + + // Don't consume trailing commas as valid + soFar = soFar.slice( match[ 0 ].length ) || soFar; + } + groups.push( ( tokens = [] ) ); + } + + matched = false; + + // Combinators + if ( ( match = rcombinators.exec( soFar ) ) ) { + matched = match.shift(); + tokens.push( { + value: matched, + + // Cast descendant combinators to space + type: match[ 0 ].replace( rtrim, " " ) + } ); + soFar = soFar.slice( matched.length ); + } + + // Filters + for ( type in Expr.filter ) { + if ( ( match = matchExpr[ type ].exec( soFar ) ) && ( !preFilters[ type ] || + ( match = preFilters[ type ]( match ) ) ) ) { + matched = match.shift(); + tokens.push( { + value: matched, + type: type, + matches: match + } ); + soFar = soFar.slice( matched.length ); + } + } + + if ( !matched ) { + break; + } + } + + // Return the length of the invalid excess + // if we're just parsing + // Otherwise, throw an error or return tokens + return parseOnly ? + soFar.length : + soFar ? + Sizzle.error( selector ) : + + // Cache the tokens + tokenCache( selector, groups ).slice( 0 ); +}; + +function toSelector( tokens ) { + var i = 0, + len = tokens.length, + selector = ""; + for ( ; i < len; i++ ) { + selector += tokens[ i ].value; + } + return selector; +} + +function addCombinator( matcher, combinator, base ) { + var dir = combinator.dir, + skip = combinator.next, + key = skip || dir, + checkNonElements = base && key === "parentNode", + doneName = done++; + + return combinator.first ? + + // Check against closest ancestor/preceding element + function( elem, context, xml ) { + while ( ( elem = elem[ dir ] ) ) { + if ( elem.nodeType === 1 || checkNonElements ) { + return matcher( elem, context, xml ); + } + } + return false; + } : + + // Check against all ancestor/preceding elements + function( elem, context, xml ) { + var oldCache, uniqueCache, outerCache, + newCache = [ dirruns, doneName ]; + + // We can't set arbitrary data on XML nodes, so they don't benefit from combinator caching + if ( xml ) { + while ( ( elem = elem[ dir ] ) ) { + if ( elem.nodeType === 1 || checkNonElements ) { + if ( matcher( elem, context, xml ) ) { + return true; + } + } + } + } else { + while ( ( elem = elem[ dir ] ) ) { + if ( elem.nodeType === 1 || checkNonElements ) { + outerCache = elem[ expando ] || ( elem[ expando ] = {} ); + + // Support: IE <9 only + // Defend against cloned attroperties (jQuery gh-1709) + uniqueCache = outerCache[ elem.uniqueID ] || + ( outerCache[ elem.uniqueID ] = {} ); + + if ( skip && skip === elem.nodeName.toLowerCase() ) { + elem = elem[ dir ] || elem; + } else if ( ( oldCache = uniqueCache[ key ] ) && + oldCache[ 0 ] === dirruns && oldCache[ 1 ] === doneName ) { + + // Assign to newCache so results back-propagate to previous elements + return ( newCache[ 2 ] = oldCache[ 2 ] ); + } else { + + // Reuse newcache so results back-propagate to previous elements + uniqueCache[ key ] = newCache; + + // A match means we're done; a fail means we have to keep checking + if ( ( newCache[ 2 ] = matcher( elem, context, xml ) ) ) { + return true; + } + } + } + } + } + return false; + }; +} + +function elementMatcher( matchers ) { + return matchers.length > 1 ? + function( elem, context, xml ) { + var i = matchers.length; + while ( i-- ) { + if ( !matchers[ i ]( elem, context, xml ) ) { + return false; + } + } + return true; + } : + matchers[ 0 ]; +} + +function multipleContexts( selector, contexts, results ) { + var i = 0, + len = contexts.length; + for ( ; i < len; i++ ) { + Sizzle( selector, contexts[ i ], results ); + } + return results; +} + +function condense( unmatched, map, filter, context, xml ) { + var elem, + newUnmatched = [], + i = 0, + len = unmatched.length, + mapped = map != null; + + for ( ; i < len; i++ ) { + if ( ( elem = unmatched[ i ] ) ) { + if ( !filter || filter( elem, context, xml ) ) { + newUnmatched.push( elem ); + if ( mapped ) { + map.push( i ); + } + } + } + } + + return newUnmatched; +} + +function setMatcher( preFilter, selector, matcher, postFilter, postFinder, postSelector ) { + if ( postFilter && !postFilter[ expando ] ) { + postFilter = setMatcher( postFilter ); + } + if ( postFinder && !postFinder[ expando ] ) { + postFinder = setMatcher( postFinder, postSelector ); + } + return markFunction( function( seed, results, context, xml ) { + var temp, i, elem, + preMap = [], + postMap = [], + preexisting = results.length, + + // Get initial elements from seed or context + elems = seed || multipleContexts( + selector || "*", + context.nodeType ? [ context ] : context, + [] + ), + + // Prefilter to get matcher input, preserving a map for seed-results synchronization + matcherIn = preFilter && ( seed || !selector ) ? + condense( elems, preMap, preFilter, context, xml ) : + elems, + + matcherOut = matcher ? + + // If we have a postFinder, or filtered seed, or non-seed postFilter or preexisting results, + postFinder || ( seed ? preFilter : preexisting || postFilter ) ? + + // ...intermediate processing is necessary + [] : + + // ...otherwise use results directly + results : + matcherIn; + + // Find primary matches + if ( matcher ) { + matcher( matcherIn, matcherOut, context, xml ); + } + + // Apply postFilter + if ( postFilter ) { + temp = condense( matcherOut, postMap ); + postFilter( temp, [], context, xml ); + + // Un-match failing elements by moving them back to matcherIn + i = temp.length; + while ( i-- ) { + if ( ( elem = temp[ i ] ) ) { + matcherOut[ postMap[ i ] ] = !( matcherIn[ postMap[ i ] ] = elem ); + } + } + } + + if ( seed ) { + if ( postFinder || preFilter ) { + if ( postFinder ) { + + // Get the final matcherOut by condensing this intermediate into postFinder contexts + temp = []; + i = matcherOut.length; + while ( i-- ) { + if ( ( elem = matcherOut[ i ] ) ) { + + // Restore matcherIn since elem is not yet a final match + temp.push( ( matcherIn[ i ] = elem ) ); + } + } + postFinder( null, ( matcherOut = [] ), temp, xml ); + } + + // Move matched elements from seed to results to keep them synchronized + i = matcherOut.length; + while ( i-- ) { + if ( ( elem = matcherOut[ i ] ) && + ( temp = postFinder ? indexOf( seed, elem ) : preMap[ i ] ) > -1 ) { + + seed[ temp ] = !( results[ temp ] = elem ); + } + } + } + + // Add elements to results, through postFinder if defined + } else { + matcherOut = condense( + matcherOut === results ? + matcherOut.splice( preexisting, matcherOut.length ) : + matcherOut + ); + if ( postFinder ) { + postFinder( null, results, matcherOut, xml ); + } else { + push.apply( results, matcherOut ); + } + } + } ); +} + +function matcherFromTokens( tokens ) { + var checkContext, matcher, j, + len = tokens.length, + leadingRelative = Expr.relative[ tokens[ 0 ].type ], + implicitRelative = leadingRelative || Expr.relative[ " " ], + i = leadingRelative ? 1 : 0, + + // The foundational matcher ensures that elements are reachable from top-level context(s) + matchContext = addCombinator( function( elem ) { + return elem === checkContext; + }, implicitRelative, true ), + matchAnyContext = addCombinator( function( elem ) { + return indexOf( checkContext, elem ) > -1; + }, implicitRelative, true ), + matchers = [ function( elem, context, xml ) { + var ret = ( !leadingRelative && ( xml || context !== outermostContext ) ) || ( + ( checkContext = context ).nodeType ? + matchContext( elem, context, xml ) : + matchAnyContext( elem, context, xml ) ); + + // Avoid hanging onto element (issue #299) + checkContext = null; + return ret; + } ]; + + for ( ; i < len; i++ ) { + if ( ( matcher = Expr.relative[ tokens[ i ].type ] ) ) { + matchers = [ addCombinator( elementMatcher( matchers ), matcher ) ]; + } else { + matcher = Expr.filter[ tokens[ i ].type ].apply( null, tokens[ i ].matches ); + + // Return special upon seeing a positional matcher + if ( matcher[ expando ] ) { + + // Find the next relative operator (if any) for proper handling + j = ++i; + for ( ; j < len; j++ ) { + if ( Expr.relative[ tokens[ j ].type ] ) { + break; + } + } + return setMatcher( + i > 1 && elementMatcher( matchers ), + i > 1 && toSelector( + + // If the preceding token was a descendant combinator, insert an implicit any-element `*` + tokens + .slice( 0, i - 1 ) + .concat( { value: tokens[ i - 2 ].type === " " ? "*" : "" } ) + ).replace( rtrim, "$1" ), + matcher, + i < j && matcherFromTokens( tokens.slice( i, j ) ), + j < len && matcherFromTokens( ( tokens = tokens.slice( j ) ) ), + j < len && toSelector( tokens ) + ); + } + matchers.push( matcher ); + } + } + + return elementMatcher( matchers ); +} + +function matcherFromGroupMatchers( elementMatchers, setMatchers ) { + var bySet = setMatchers.length > 0, + byElement = elementMatchers.length > 0, + superMatcher = function( seed, context, xml, results, outermost ) { + var elem, j, matcher, + matchedCount = 0, + i = "0", + unmatched = seed && [], + setMatched = [], + contextBackup = outermostContext, + + // We must always have either seed elements or outermost context + elems = seed || byElement && Expr.find[ "TAG" ]( "*", outermost ), + + // Use integer dirruns iff this is the outermost matcher + dirrunsUnique = ( dirruns += contextBackup == null ? 1 : Math.random() || 0.1 ), + len = elems.length; + + if ( outermost ) { + + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + outermostContext = context == document || context || outermost; + } + + // Add elements passing elementMatchers directly to results + // Support: IE<9, Safari + // Tolerate NodeList properties (IE: "length"; Safari: ) matching elements by id + for ( ; i !== len && ( elem = elems[ i ] ) != null; i++ ) { + if ( byElement && elem ) { + j = 0; + + // Support: IE 11+, Edge 17 - 18+ + // IE/Edge sometimes throw a "Permission denied" error when strict-comparing + // two documents; shallow comparisons work. + // eslint-disable-next-line eqeqeq + if ( !context && elem.ownerDocument != document ) { + setDocument( elem ); + xml = !documentIsHTML; + } + while ( ( matcher = elementMatchers[ j++ ] ) ) { + if ( matcher( elem, context || document, xml ) ) { + results.push( elem ); + break; + } + } + if ( outermost ) { + dirruns = dirrunsUnique; + } + } + + // Track unmatched elements for set filters + if ( bySet ) { + + // They will have gone through all possible matchers + if ( ( elem = !matcher && elem ) ) { + matchedCount--; + } + + // Lengthen the array for every element, matched or not + if ( seed ) { + unmatched.push( elem ); + } + } + } + + // `i` is now the count of elements visited above, and adding it to `matchedCount` + // makes the latter nonnegative. + matchedCount += i; + + // Apply set filters to unmatched elements + // NOTE: This can be skipped if there are no unmatched elements (i.e., `matchedCount` + // equals `i`), unless we didn't visit _any_ elements in the above loop because we have + // no element matchers and no seed. + // Incrementing an initially-string "0" `i` allows `i` to remain a string only in that + // case, which will result in a "00" `matchedCount` that differs from `i` but is also + // numerically zero. + if ( bySet && i !== matchedCount ) { + j = 0; + while ( ( matcher = setMatchers[ j++ ] ) ) { + matcher( unmatched, setMatched, context, xml ); + } + + if ( seed ) { + + // Reintegrate element matches to eliminate the need for sorting + if ( matchedCount > 0 ) { + while ( i-- ) { + if ( !( unmatched[ i ] || setMatched[ i ] ) ) { + setMatched[ i ] = pop.call( results ); + } + } + } + + // Discard index placeholder values to get only actual matches + setMatched = condense( setMatched ); + } + + // Add matches to results + push.apply( results, setMatched ); + + // Seedless set matches succeeding multiple successful matchers stipulate sorting + if ( outermost && !seed && setMatched.length > 0 && + ( matchedCount + setMatchers.length ) > 1 ) { + + Sizzle.uniqueSort( results ); + } + } + + // Override manipulation of globals by nested matchers + if ( outermost ) { + dirruns = dirrunsUnique; + outermostContext = contextBackup; + } + + return unmatched; + }; + + return bySet ? + markFunction( superMatcher ) : + superMatcher; +} + +compile = Sizzle.compile = function( selector, match /* Internal Use Only */ ) { + var i, + setMatchers = [], + elementMatchers = [], + cached = compilerCache[ selector + " " ]; + + if ( !cached ) { + + // Generate a function of recursive functions that can be used to check each element + if ( !match ) { + match = tokenize( selector ); + } + i = match.length; + while ( i-- ) { + cached = matcherFromTokens( match[ i ] ); + if ( cached[ expando ] ) { + setMatchers.push( cached ); + } else { + elementMatchers.push( cached ); + } + } + + // Cache the compiled function + cached = compilerCache( + selector, + matcherFromGroupMatchers( elementMatchers, setMatchers ) + ); + + // Save selector and tokenization + cached.selector = selector; + } + return cached; +}; + +/** + * A low-level selection function that works with Sizzle's compiled + * selector functions + * @param {String|Function} selector A selector or a pre-compiled + * selector function built with Sizzle.compile + * @param {Element} context + * @param {Array} [results] + * @param {Array} [seed] A set of elements to match against + */ +select = Sizzle.select = function( selector, context, results, seed ) { + var i, tokens, token, type, find, + compiled = typeof selector === "function" && selector, + match = !seed && tokenize( ( selector = compiled.selector || selector ) ); + + results = results || []; + + // Try to minimize operations if there is only one selector in the list and no seed + // (the latter of which guarantees us context) + if ( match.length === 1 ) { + + // Reduce context if the leading compound selector is an ID + tokens = match[ 0 ] = match[ 0 ].slice( 0 ); + if ( tokens.length > 2 && ( token = tokens[ 0 ] ).type === "ID" && + context.nodeType === 9 && documentIsHTML && Expr.relative[ tokens[ 1 ].type ] ) { + + context = ( Expr.find[ "ID" ]( token.matches[ 0 ] + .replace( runescape, funescape ), context ) || [] )[ 0 ]; + if ( !context ) { + return results; + + // Precompiled matchers will still verify ancestry, so step up a level + } else if ( compiled ) { + context = context.parentNode; + } + + selector = selector.slice( tokens.shift().value.length ); + } + + // Fetch a seed set for right-to-left matching + i = matchExpr[ "needsContext" ].test( selector ) ? 0 : tokens.length; + while ( i-- ) { + token = tokens[ i ]; + + // Abort if we hit a combinator + if ( Expr.relative[ ( type = token.type ) ] ) { + break; + } + if ( ( find = Expr.find[ type ] ) ) { + + // Search, expanding context for leading sibling combinators + if ( ( seed = find( + token.matches[ 0 ].replace( runescape, funescape ), + rsibling.test( tokens[ 0 ].type ) && testContext( context.parentNode ) || + context + ) ) ) { + + // If seed is empty or no tokens remain, we can return early + tokens.splice( i, 1 ); + selector = seed.length && toSelector( tokens ); + if ( !selector ) { + push.apply( results, seed ); + return results; + } + + break; + } + } + } + } + + // Compile and execute a filtering function if one is not provided + // Provide `match` to avoid retokenization if we modified the selector above + ( compiled || compile( selector, match ) )( + seed, + context, + !documentIsHTML, + results, + !context || rsibling.test( selector ) && testContext( context.parentNode ) || context + ); + return results; +}; + +// One-time assignments + +// Sort stability +support.sortStable = expando.split( "" ).sort( sortOrder ).join( "" ) === expando; + +// Support: Chrome 14-35+ +// Always assume duplicates if they aren't passed to the comparison function +support.detectDuplicates = !!hasDuplicate; + +// Initialize against the default document +setDocument(); + +// Support: Webkit<537.32 - Safari 6.0.3/Chrome 25 (fixed in Chrome 27) +// Detached nodes confoundingly follow *each other* +support.sortDetached = assert( function( el ) { + + // Should return 1, but returns 4 (following) + return el.compareDocumentPosition( document.createElement( "fieldset" ) ) & 1; +} ); + +// Support: IE<8 +// Prevent attribute/property "interpolation" +// https://msdn.microsoft.com/en-us/library/ms536429%28VS.85%29.aspx +if ( !assert( function( el ) { + el.innerHTML = ""; + return el.firstChild.getAttribute( "href" ) === "#"; +} ) ) { + addHandle( "type|href|height|width", function( elem, name, isXML ) { + if ( !isXML ) { + return elem.getAttribute( name, name.toLowerCase() === "type" ? 1 : 2 ); + } + } ); +} + +// Support: IE<9 +// Use defaultValue in place of getAttribute("value") +if ( !support.attributes || !assert( function( el ) { + el.innerHTML = ""; + el.firstChild.setAttribute( "value", "" ); + return el.firstChild.getAttribute( "value" ) === ""; +} ) ) { + addHandle( "value", function( elem, _name, isXML ) { + if ( !isXML && elem.nodeName.toLowerCase() === "input" ) { + return elem.defaultValue; + } + } ); +} + +// Support: IE<9 +// Use getAttributeNode to fetch booleans when getAttribute lies +if ( !assert( function( el ) { + return el.getAttribute( "disabled" ) == null; +} ) ) { + addHandle( booleans, function( elem, name, isXML ) { + var val; + if ( !isXML ) { + return elem[ name ] === true ? name.toLowerCase() : + ( val = elem.getAttributeNode( name ) ) && val.specified ? + val.value : + null; + } + } ); +} + +return Sizzle; + +} )( window ); + + + +jQuery.find = Sizzle; +jQuery.expr = Sizzle.selectors; + +// Deprecated +jQuery.expr[ ":" ] = jQuery.expr.pseudos; +jQuery.uniqueSort = jQuery.unique = Sizzle.uniqueSort; +jQuery.text = Sizzle.getText; +jQuery.isXMLDoc = Sizzle.isXML; +jQuery.contains = Sizzle.contains; +jQuery.escapeSelector = Sizzle.escape; + + + + +var dir = function( elem, dir, until ) { + var matched = [], + truncate = until !== undefined; + + while ( ( elem = elem[ dir ] ) && elem.nodeType !== 9 ) { + if ( elem.nodeType === 1 ) { + if ( truncate && jQuery( elem ).is( until ) ) { + break; + } + matched.push( elem ); + } + } + return matched; +}; + + +var siblings = function( n, elem ) { + var matched = []; + + for ( ; n; n = n.nextSibling ) { + if ( n.nodeType === 1 && n !== elem ) { + matched.push( n ); + } + } + + return matched; +}; + + +var rneedsContext = jQuery.expr.match.needsContext; + + + +function nodeName( elem, name ) { + + return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase(); + +}; +var rsingleTag = ( /^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i ); + + + +// Implement the identical functionality for filter and not +function winnow( elements, qualifier, not ) { + if ( isFunction( qualifier ) ) { + return jQuery.grep( elements, function( elem, i ) { + return !!qualifier.call( elem, i, elem ) !== not; + } ); + } + + // Single element + if ( qualifier.nodeType ) { + return jQuery.grep( elements, function( elem ) { + return ( elem === qualifier ) !== not; + } ); + } + + // Arraylike of elements (jQuery, arguments, Array) + if ( typeof qualifier !== "string" ) { + return jQuery.grep( elements, function( elem ) { + return ( indexOf.call( qualifier, elem ) > -1 ) !== not; + } ); + } + + // Filtered directly for both simple and complex selectors + return jQuery.filter( qualifier, elements, not ); +} + +jQuery.filter = function( expr, elems, not ) { + var elem = elems[ 0 ]; + + if ( not ) { + expr = ":not(" + expr + ")"; + } + + if ( elems.length === 1 && elem.nodeType === 1 ) { + return jQuery.find.matchesSelector( elem, expr ) ? [ elem ] : []; + } + + return jQuery.find.matches( expr, jQuery.grep( elems, function( elem ) { + return elem.nodeType === 1; + } ) ); +}; + +jQuery.fn.extend( { + find: function( selector ) { + var i, ret, + len = this.length, + self = this; + + if ( typeof selector !== "string" ) { + return this.pushStack( jQuery( selector ).filter( function() { + for ( i = 0; i < len; i++ ) { + if ( jQuery.contains( self[ i ], this ) ) { + return true; + } + } + } ) ); + } + + ret = this.pushStack( [] ); + + for ( i = 0; i < len; i++ ) { + jQuery.find( selector, self[ i ], ret ); + } + + return len > 1 ? jQuery.uniqueSort( ret ) : ret; + }, + filter: function( selector ) { + return this.pushStack( winnow( this, selector || [], false ) ); + }, + not: function( selector ) { + return this.pushStack( winnow( this, selector || [], true ) ); + }, + is: function( selector ) { + return !!winnow( + this, + + // If this is a positional/relative selector, check membership in the returned set + // so $("p:first").is("p:last") won't return true for a doc with two "p". + typeof selector === "string" && rneedsContext.test( selector ) ? + jQuery( selector ) : + selector || [], + false + ).length; + } +} ); + + +// Initialize a jQuery object + + +// A central reference to the root jQuery(document) +var rootjQuery, + + // A simple way to check for HTML strings + // Prioritize #id over to avoid XSS via location.hash (#9521) + // Strict HTML recognition (#11290: must start with <) + // Shortcut simple #id case for speed + rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/, + + init = jQuery.fn.init = function( selector, context, root ) { + var match, elem; + + // HANDLE: $(""), $(null), $(undefined), $(false) + if ( !selector ) { + return this; + } + + // Method init() accepts an alternate rootjQuery + // so migrate can support jQuery.sub (gh-2101) + root = root || rootjQuery; + + // Handle HTML strings + if ( typeof selector === "string" ) { + if ( selector[ 0 ] === "<" && + selector[ selector.length - 1 ] === ">" && + selector.length >= 3 ) { + + // Assume that strings that start and end with <> are HTML and skip the regex check + match = [ null, selector, null ]; + + } else { + match = rquickExpr.exec( selector ); + } + + // Match html or make sure no context is specified for #id + if ( match && ( match[ 1 ] || !context ) ) { + + // HANDLE: $(html) -> $(array) + if ( match[ 1 ] ) { + context = context instanceof jQuery ? context[ 0 ] : context; + + // Option to run scripts is true for back-compat + // Intentionally let the error be thrown if parseHTML is not present + jQuery.merge( this, jQuery.parseHTML( + match[ 1 ], + context && context.nodeType ? context.ownerDocument || context : document, + true + ) ); + + // HANDLE: $(html, props) + if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) { + for ( match in context ) { + + // Properties of context are called as methods if possible + if ( isFunction( this[ match ] ) ) { + this[ match ]( context[ match ] ); + + // ...and otherwise set as attributes + } else { + this.attr( match, context[ match ] ); + } + } + } + + return this; + + // HANDLE: $(#id) + } else { + elem = document.getElementById( match[ 2 ] ); + + if ( elem ) { + + // Inject the element directly into the jQuery object + this[ 0 ] = elem; + this.length = 1; + } + return this; + } + + // HANDLE: $(expr, $(...)) + } else if ( !context || context.jquery ) { + return ( context || root ).find( selector ); + + // HANDLE: $(expr, context) + // (which is just equivalent to: $(context).find(expr) + } else { + return this.constructor( context ).find( selector ); + } + + // HANDLE: $(DOMElement) + } else if ( selector.nodeType ) { + this[ 0 ] = selector; + this.length = 1; + return this; + + // HANDLE: $(function) + // Shortcut for document ready + } else if ( isFunction( selector ) ) { + return root.ready !== undefined ? + root.ready( selector ) : + + // Execute immediately if ready is not present + selector( jQuery ); + } + + return jQuery.makeArray( selector, this ); + }; + +// Give the init function the jQuery prototype for later instantiation +init.prototype = jQuery.fn; + +// Initialize central reference +rootjQuery = jQuery( document ); + + +var rparentsprev = /^(?:parents|prev(?:Until|All))/, + + // Methods guaranteed to produce a unique set when starting from a unique set + guaranteedUnique = { + children: true, + contents: true, + next: true, + prev: true + }; + +jQuery.fn.extend( { + has: function( target ) { + var targets = jQuery( target, this ), + l = targets.length; + + return this.filter( function() { + var i = 0; + for ( ; i < l; i++ ) { + if ( jQuery.contains( this, targets[ i ] ) ) { + return true; + } + } + } ); + }, + + closest: function( selectors, context ) { + var cur, + i = 0, + l = this.length, + matched = [], + targets = typeof selectors !== "string" && jQuery( selectors ); + + // Positional selectors never match, since there's no _selection_ context + if ( !rneedsContext.test( selectors ) ) { + for ( ; i < l; i++ ) { + for ( cur = this[ i ]; cur && cur !== context; cur = cur.parentNode ) { + + // Always skip document fragments + if ( cur.nodeType < 11 && ( targets ? + targets.index( cur ) > -1 : + + // Don't pass non-elements to Sizzle + cur.nodeType === 1 && + jQuery.find.matchesSelector( cur, selectors ) ) ) { + + matched.push( cur ); + break; + } + } + } + } + + return this.pushStack( matched.length > 1 ? jQuery.uniqueSort( matched ) : matched ); + }, + + // Determine the position of an element within the set + index: function( elem ) { + + // No argument, return index in parent + if ( !elem ) { + return ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll().length : -1; + } + + // Index in selector + if ( typeof elem === "string" ) { + return indexOf.call( jQuery( elem ), this[ 0 ] ); + } + + // Locate the position of the desired element + return indexOf.call( this, + + // If it receives a jQuery object, the first element is used + elem.jquery ? elem[ 0 ] : elem + ); + }, + + add: function( selector, context ) { + return this.pushStack( + jQuery.uniqueSort( + jQuery.merge( this.get(), jQuery( selector, context ) ) + ) + ); + }, + + addBack: function( selector ) { + return this.add( selector == null ? + this.prevObject : this.prevObject.filter( selector ) + ); + } +} ); + +function sibling( cur, dir ) { + while ( ( cur = cur[ dir ] ) && cur.nodeType !== 1 ) {} + return cur; +} + +jQuery.each( { + parent: function( elem ) { + var parent = elem.parentNode; + return parent && parent.nodeType !== 11 ? parent : null; + }, + parents: function( elem ) { + return dir( elem, "parentNode" ); + }, + parentsUntil: function( elem, _i, until ) { + return dir( elem, "parentNode", until ); + }, + next: function( elem ) { + return sibling( elem, "nextSibling" ); + }, + prev: function( elem ) { + return sibling( elem, "previousSibling" ); + }, + nextAll: function( elem ) { + return dir( elem, "nextSibling" ); + }, + prevAll: function( elem ) { + return dir( elem, "previousSibling" ); + }, + nextUntil: function( elem, _i, until ) { + return dir( elem, "nextSibling", until ); + }, + prevUntil: function( elem, _i, until ) { + return dir( elem, "previousSibling", until ); + }, + siblings: function( elem ) { + return siblings( ( elem.parentNode || {} ).firstChild, elem ); + }, + children: function( elem ) { + return siblings( elem.firstChild ); + }, + contents: function( elem ) { + if ( elem.contentDocument != null && + + // Support: IE 11+ + // elements with no `data` attribute has an object + // `contentDocument` with a `null` prototype. + getProto( elem.contentDocument ) ) { + + return elem.contentDocument; + } + + // Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only + // Treat the template element as a regular one in browsers that + // don't support it. + if ( nodeName( elem, "template" ) ) { + elem = elem.content || elem; + } + + return jQuery.merge( [], elem.childNodes ); + } +}, function( name, fn ) { + jQuery.fn[ name ] = function( until, selector ) { + var matched = jQuery.map( this, fn, until ); + + if ( name.slice( -5 ) !== "Until" ) { + selector = until; + } + + if ( selector && typeof selector === "string" ) { + matched = jQuery.filter( selector, matched ); + } + + if ( this.length > 1 ) { + + // Remove duplicates + if ( !guaranteedUnique[ name ] ) { + jQuery.uniqueSort( matched ); + } + + // Reverse order for parents* and prev-derivatives + if ( rparentsprev.test( name ) ) { + matched.reverse(); + } + } + + return this.pushStack( matched ); + }; +} ); +var rnothtmlwhite = ( /[^\x20\t\r\n\f]+/g ); + + + +// Convert String-formatted options into Object-formatted ones +function createOptions( options ) { + var object = {}; + jQuery.each( options.match( rnothtmlwhite ) || [], function( _, flag ) { + object[ flag ] = true; + } ); + return object; +} + +/* + * Create a callback list using the following parameters: + * + * options: an optional list of space-separated options that will change how + * the callback list behaves or a more traditional option object + * + * By default a callback list will act like an event callback list and can be + * "fired" multiple times. + * + * Possible options: + * + * once: will ensure the callback list can only be fired once (like a Deferred) + * + * memory: will keep track of previous values and will call any callback added + * after the list has been fired right away with the latest "memorized" + * values (like a Deferred) + * + * unique: will ensure a callback can only be added once (no duplicate in the list) + * + * stopOnFalse: interrupt callings when a callback returns false + * + */ +jQuery.Callbacks = function( options ) { + + // Convert options from String-formatted to Object-formatted if needed + // (we check in cache first) + options = typeof options === "string" ? + createOptions( options ) : + jQuery.extend( {}, options ); + + var // Flag to know if list is currently firing + firing, + + // Last fire value for non-forgettable lists + memory, + + // Flag to know if list was already fired + fired, + + // Flag to prevent firing + locked, + + // Actual callback list + list = [], + + // Queue of execution data for repeatable lists + queue = [], + + // Index of currently firing callback (modified by add/remove as needed) + firingIndex = -1, + + // Fire callbacks + fire = function() { + + // Enforce single-firing + locked = locked || options.once; + + // Execute callbacks for all pending executions, + // respecting firingIndex overrides and runtime changes + fired = firing = true; + for ( ; queue.length; firingIndex = -1 ) { + memory = queue.shift(); + while ( ++firingIndex < list.length ) { + + // Run callback and check for early termination + if ( list[ firingIndex ].apply( memory[ 0 ], memory[ 1 ] ) === false && + options.stopOnFalse ) { + + // Jump to end and forget the data so .add doesn't re-fire + firingIndex = list.length; + memory = false; + } + } + } + + // Forget the data if we're done with it + if ( !options.memory ) { + memory = false; + } + + firing = false; + + // Clean up if we're done firing for good + if ( locked ) { + + // Keep an empty list if we have data for future add calls + if ( memory ) { + list = []; + + // Otherwise, this object is spent + } else { + list = ""; + } + } + }, + + // Actual Callbacks object + self = { + + // Add a callback or a collection of callbacks to the list + add: function() { + if ( list ) { + + // If we have memory from a past run, we should fire after adding + if ( memory && !firing ) { + firingIndex = list.length - 1; + queue.push( memory ); + } + + ( function add( args ) { + jQuery.each( args, function( _, arg ) { + if ( isFunction( arg ) ) { + if ( !options.unique || !self.has( arg ) ) { + list.push( arg ); + } + } else if ( arg && arg.length && toType( arg ) !== "string" ) { + + // Inspect recursively + add( arg ); + } + } ); + } )( arguments ); + + if ( memory && !firing ) { + fire(); + } + } + return this; + }, + + // Remove a callback from the list + remove: function() { + jQuery.each( arguments, function( _, arg ) { + var index; + while ( ( index = jQuery.inArray( arg, list, index ) ) > -1 ) { + list.splice( index, 1 ); + + // Handle firing indexes + if ( index <= firingIndex ) { + firingIndex--; + } + } + } ); + return this; + }, + + // Check if a given callback is in the list. + // If no argument is given, return whether or not list has callbacks attached. + has: function( fn ) { + return fn ? + jQuery.inArray( fn, list ) > -1 : + list.length > 0; + }, + + // Remove all callbacks from the list + empty: function() { + if ( list ) { + list = []; + } + return this; + }, + + // Disable .fire and .add + // Abort any current/pending executions + // Clear all callbacks and values + disable: function() { + locked = queue = []; + list = memory = ""; + return this; + }, + disabled: function() { + return !list; + }, + + // Disable .fire + // Also disable .add unless we have memory (since it would have no effect) + // Abort any pending executions + lock: function() { + locked = queue = []; + if ( !memory && !firing ) { + list = memory = ""; + } + return this; + }, + locked: function() { + return !!locked; + }, + + // Call all callbacks with the given context and arguments + fireWith: function( context, args ) { + if ( !locked ) { + args = args || []; + args = [ context, args.slice ? args.slice() : args ]; + queue.push( args ); + if ( !firing ) { + fire(); + } + } + return this; + }, + + // Call all the callbacks with the given arguments + fire: function() { + self.fireWith( this, arguments ); + return this; + }, + + // To know if the callbacks have already been called at least once + fired: function() { + return !!fired; + } + }; + + return self; +}; + + +function Identity( v ) { + return v; +} +function Thrower( ex ) { + throw ex; +} + +function adoptValue( value, resolve, reject, noValue ) { + var method; + + try { + + // Check for promise aspect first to privilege synchronous behavior + if ( value && isFunction( ( method = value.promise ) ) ) { + method.call( value ).done( resolve ).fail( reject ); + + // Other thenables + } else if ( value && isFunction( ( method = value.then ) ) ) { + method.call( value, resolve, reject ); + + // Other non-thenables + } else { + + // Control `resolve` arguments by letting Array#slice cast boolean `noValue` to integer: + // * false: [ value ].slice( 0 ) => resolve( value ) + // * true: [ value ].slice( 1 ) => resolve() + resolve.apply( undefined, [ value ].slice( noValue ) ); + } + + // For Promises/A+, convert exceptions into rejections + // Since jQuery.when doesn't unwrap thenables, we can skip the extra checks appearing in + // Deferred#then to conditionally suppress rejection. + } catch ( value ) { + + // Support: Android 4.0 only + // Strict mode functions invoked without .call/.apply get global-object context + reject.apply( undefined, [ value ] ); + } +} + +jQuery.extend( { + + Deferred: function( func ) { + var tuples = [ + + // action, add listener, callbacks, + // ... .then handlers, argument index, [final state] + [ "notify", "progress", jQuery.Callbacks( "memory" ), + jQuery.Callbacks( "memory" ), 2 ], + [ "resolve", "done", jQuery.Callbacks( "once memory" ), + jQuery.Callbacks( "once memory" ), 0, "resolved" ], + [ "reject", "fail", jQuery.Callbacks( "once memory" ), + jQuery.Callbacks( "once memory" ), 1, "rejected" ] + ], + state = "pending", + promise = { + state: function() { + return state; + }, + always: function() { + deferred.done( arguments ).fail( arguments ); + return this; + }, + "catch": function( fn ) { + return promise.then( null, fn ); + }, + + // Keep pipe for back-compat + pipe: function( /* fnDone, fnFail, fnProgress */ ) { + var fns = arguments; + + return jQuery.Deferred( function( newDefer ) { + jQuery.each( tuples, function( _i, tuple ) { + + // Map tuples (progress, done, fail) to arguments (done, fail, progress) + var fn = isFunction( fns[ tuple[ 4 ] ] ) && fns[ tuple[ 4 ] ]; + + // deferred.progress(function() { bind to newDefer or newDefer.notify }) + // deferred.done(function() { bind to newDefer or newDefer.resolve }) + // deferred.fail(function() { bind to newDefer or newDefer.reject }) + deferred[ tuple[ 1 ] ]( function() { + var returned = fn && fn.apply( this, arguments ); + if ( returned && isFunction( returned.promise ) ) { + returned.promise() + .progress( newDefer.notify ) + .done( newDefer.resolve ) + .fail( newDefer.reject ); + } else { + newDefer[ tuple[ 0 ] + "With" ]( + this, + fn ? [ returned ] : arguments + ); + } + } ); + } ); + fns = null; + } ).promise(); + }, + then: function( onFulfilled, onRejected, onProgress ) { + var maxDepth = 0; + function resolve( depth, deferred, handler, special ) { + return function() { + var that = this, + args = arguments, + mightThrow = function() { + var returned, then; + + // Support: Promises/A+ section 2.3.3.3.3 + // https://promisesaplus.com/#point-59 + // Ignore double-resolution attempts + if ( depth < maxDepth ) { + return; + } + + returned = handler.apply( that, args ); + + // Support: Promises/A+ section 2.3.1 + // https://promisesaplus.com/#point-48 + if ( returned === deferred.promise() ) { + throw new TypeError( "Thenable self-resolution" ); + } + + // Support: Promises/A+ sections 2.3.3.1, 3.5 + // https://promisesaplus.com/#point-54 + // https://promisesaplus.com/#point-75 + // Retrieve `then` only once + then = returned && + + // Support: Promises/A+ section 2.3.4 + // https://promisesaplus.com/#point-64 + // Only check objects and functions for thenability + ( typeof returned === "object" || + typeof returned === "function" ) && + returned.then; + + // Handle a returned thenable + if ( isFunction( then ) ) { + + // Special processors (notify) just wait for resolution + if ( special ) { + then.call( + returned, + resolve( maxDepth, deferred, Identity, special ), + resolve( maxDepth, deferred, Thrower, special ) + ); + + // Normal processors (resolve) also hook into progress + } else { + + // ...and disregard older resolution values + maxDepth++; + + then.call( + returned, + resolve( maxDepth, deferred, Identity, special ), + resolve( maxDepth, deferred, Thrower, special ), + resolve( maxDepth, deferred, Identity, + deferred.notifyWith ) + ); + } + + // Handle all other returned values + } else { + + // Only substitute handlers pass on context + // and multiple values (non-spec behavior) + if ( handler !== Identity ) { + that = undefined; + args = [ returned ]; + } + + // Process the value(s) + // Default process is resolve + ( special || deferred.resolveWith )( that, args ); + } + }, + + // Only normal processors (resolve) catch and reject exceptions + process = special ? + mightThrow : + function() { + try { + mightThrow(); + } catch ( e ) { + + if ( jQuery.Deferred.exceptionHook ) { + jQuery.Deferred.exceptionHook( e, + process.stackTrace ); + } + + // Support: Promises/A+ section 2.3.3.3.4.1 + // https://promisesaplus.com/#point-61 + // Ignore post-resolution exceptions + if ( depth + 1 >= maxDepth ) { + + // Only substitute handlers pass on context + // and multiple values (non-spec behavior) + if ( handler !== Thrower ) { + that = undefined; + args = [ e ]; + } + + deferred.rejectWith( that, args ); + } + } + }; + + // Support: Promises/A+ section 2.3.3.3.1 + // https://promisesaplus.com/#point-57 + // Re-resolve promises immediately to dodge false rejection from + // subsequent errors + if ( depth ) { + process(); + } else { + + // Call an optional hook to record the stack, in case of exception + // since it's otherwise lost when execution goes async + if ( jQuery.Deferred.getStackHook ) { + process.stackTrace = jQuery.Deferred.getStackHook(); + } + window.setTimeout( process ); + } + }; + } + + return jQuery.Deferred( function( newDefer ) { + + // progress_handlers.add( ... ) + tuples[ 0 ][ 3 ].add( + resolve( + 0, + newDefer, + isFunction( onProgress ) ? + onProgress : + Identity, + newDefer.notifyWith + ) + ); + + // fulfilled_handlers.add( ... ) + tuples[ 1 ][ 3 ].add( + resolve( + 0, + newDefer, + isFunction( onFulfilled ) ? + onFulfilled : + Identity + ) + ); + + // rejected_handlers.add( ... ) + tuples[ 2 ][ 3 ].add( + resolve( + 0, + newDefer, + isFunction( onRejected ) ? + onRejected : + Thrower + ) + ); + } ).promise(); + }, + + // Get a promise for this deferred + // If obj is provided, the promise aspect is added to the object + promise: function( obj ) { + return obj != null ? jQuery.extend( obj, promise ) : promise; + } + }, + deferred = {}; + + // Add list-specific methods + jQuery.each( tuples, function( i, tuple ) { + var list = tuple[ 2 ], + stateString = tuple[ 5 ]; + + // promise.progress = list.add + // promise.done = list.add + // promise.fail = list.add + promise[ tuple[ 1 ] ] = list.add; + + // Handle state + if ( stateString ) { + list.add( + function() { + + // state = "resolved" (i.e., fulfilled) + // state = "rejected" + state = stateString; + }, + + // rejected_callbacks.disable + // fulfilled_callbacks.disable + tuples[ 3 - i ][ 2 ].disable, + + // rejected_handlers.disable + // fulfilled_handlers.disable + tuples[ 3 - i ][ 3 ].disable, + + // progress_callbacks.lock + tuples[ 0 ][ 2 ].lock, + + // progress_handlers.lock + tuples[ 0 ][ 3 ].lock + ); + } + + // progress_handlers.fire + // fulfilled_handlers.fire + // rejected_handlers.fire + list.add( tuple[ 3 ].fire ); + + // deferred.notify = function() { deferred.notifyWith(...) } + // deferred.resolve = function() { deferred.resolveWith(...) } + // deferred.reject = function() { deferred.rejectWith(...) } + deferred[ tuple[ 0 ] ] = function() { + deferred[ tuple[ 0 ] + "With" ]( this === deferred ? undefined : this, arguments ); + return this; + }; + + // deferred.notifyWith = list.fireWith + // deferred.resolveWith = list.fireWith + // deferred.rejectWith = list.fireWith + deferred[ tuple[ 0 ] + "With" ] = list.fireWith; + } ); + + // Make the deferred a promise + promise.promise( deferred ); + + // Call given func if any + if ( func ) { + func.call( deferred, deferred ); + } + + // All done! + return deferred; + }, + + // Deferred helper + when: function( singleValue ) { + var + + // count of uncompleted subordinates + remaining = arguments.length, + + // count of unprocessed arguments + i = remaining, + + // subordinate fulfillment data + resolveContexts = Array( i ), + resolveValues = slice.call( arguments ), + + // the master Deferred + master = jQuery.Deferred(), + + // subordinate callback factory + updateFunc = function( i ) { + return function( value ) { + resolveContexts[ i ] = this; + resolveValues[ i ] = arguments.length > 1 ? slice.call( arguments ) : value; + if ( !( --remaining ) ) { + master.resolveWith( resolveContexts, resolveValues ); + } + }; + }; + + // Single- and empty arguments are adopted like Promise.resolve + if ( remaining <= 1 ) { + adoptValue( singleValue, master.done( updateFunc( i ) ).resolve, master.reject, + !remaining ); + + // Use .then() to unwrap secondary thenables (cf. gh-3000) + if ( master.state() === "pending" || + isFunction( resolveValues[ i ] && resolveValues[ i ].then ) ) { + + return master.then(); + } + } + + // Multiple arguments are aggregated like Promise.all array elements + while ( i-- ) { + adoptValue( resolveValues[ i ], updateFunc( i ), master.reject ); + } + + return master.promise(); + } +} ); + + +// These usually indicate a programmer mistake during development, +// warn about them ASAP rather than swallowing them by default. +var rerrorNames = /^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/; + +jQuery.Deferred.exceptionHook = function( error, stack ) { + + // Support: IE 8 - 9 only + // Console exists when dev tools are open, which can happen at any time + if ( window.console && window.console.warn && error && rerrorNames.test( error.name ) ) { + window.console.warn( "jQuery.Deferred exception: " + error.message, error.stack, stack ); + } +}; + + + + +jQuery.readyException = function( error ) { + window.setTimeout( function() { + throw error; + } ); +}; + + + + +// The deferred used on DOM ready +var readyList = jQuery.Deferred(); + +jQuery.fn.ready = function( fn ) { + + readyList + .then( fn ) + + // Wrap jQuery.readyException in a function so that the lookup + // happens at the time of error handling instead of callback + // registration. + .catch( function( error ) { + jQuery.readyException( error ); + } ); + + return this; +}; + +jQuery.extend( { + + // Is the DOM ready to be used? Set to true once it occurs. + isReady: false, + + // A counter to track how many items to wait for before + // the ready event fires. See #6781 + readyWait: 1, + + // Handle when the DOM is ready + ready: function( wait ) { + + // Abort if there are pending holds or we're already ready + if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) { + return; + } + + // Remember that the DOM is ready + jQuery.isReady = true; + + // If a normal DOM Ready event fired, decrement, and wait if need be + if ( wait !== true && --jQuery.readyWait > 0 ) { + return; + } + + // If there are functions bound, to execute + readyList.resolveWith( document, [ jQuery ] ); + } +} ); + +jQuery.ready.then = readyList.then; + +// The ready event handler and self cleanup method +function completed() { + document.removeEventListener( "DOMContentLoaded", completed ); + window.removeEventListener( "load", completed ); + jQuery.ready(); +} + +// Catch cases where $(document).ready() is called +// after the browser event has already occurred. +// Support: IE <=9 - 10 only +// Older IE sometimes signals "interactive" too soon +if ( document.readyState === "complete" || + ( document.readyState !== "loading" && !document.documentElement.doScroll ) ) { + + // Handle it asynchronously to allow scripts the opportunity to delay ready + window.setTimeout( jQuery.ready ); + +} else { + + // Use the handy event callback + document.addEventListener( "DOMContentLoaded", completed ); + + // A fallback to window.onload, that will always work + window.addEventListener( "load", completed ); +} + + + + +// Multifunctional method to get and set values of a collection +// The value/s can optionally be executed if it's a function +var access = function( elems, fn, key, value, chainable, emptyGet, raw ) { + var i = 0, + len = elems.length, + bulk = key == null; + + // Sets many values + if ( toType( key ) === "object" ) { + chainable = true; + for ( i in key ) { + access( elems, fn, i, key[ i ], true, emptyGet, raw ); + } + + // Sets one value + } else if ( value !== undefined ) { + chainable = true; + + if ( !isFunction( value ) ) { + raw = true; + } + + if ( bulk ) { + + // Bulk operations run against the entire set + if ( raw ) { + fn.call( elems, value ); + fn = null; + + // ...except when executing function values + } else { + bulk = fn; + fn = function( elem, _key, value ) { + return bulk.call( jQuery( elem ), value ); + }; + } + } + + if ( fn ) { + for ( ; i < len; i++ ) { + fn( + elems[ i ], key, raw ? + value : + value.call( elems[ i ], i, fn( elems[ i ], key ) ) + ); + } + } + } + + if ( chainable ) { + return elems; + } + + // Gets + if ( bulk ) { + return fn.call( elems ); + } + + return len ? fn( elems[ 0 ], key ) : emptyGet; +}; + + +// Matches dashed string for camelizing +var rmsPrefix = /^-ms-/, + rdashAlpha = /-([a-z])/g; + +// Used by camelCase as callback to replace() +function fcamelCase( _all, letter ) { + return letter.toUpperCase(); +} + +// Convert dashed to camelCase; used by the css and data modules +// Support: IE <=9 - 11, Edge 12 - 15 +// Microsoft forgot to hump their vendor prefix (#9572) +function camelCase( string ) { + return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase ); +} +var acceptData = function( owner ) { + + // Accepts only: + // - Node + // - Node.ELEMENT_NODE + // - Node.DOCUMENT_NODE + // - Object + // - Any + return owner.nodeType === 1 || owner.nodeType === 9 || !( +owner.nodeType ); +}; + + + + +function Data() { + this.expando = jQuery.expando + Data.uid++; +} + +Data.uid = 1; + +Data.prototype = { + + cache: function( owner ) { + + // Check if the owner object already has a cache + var value = owner[ this.expando ]; + + // If not, create one + if ( !value ) { + value = {}; + + // We can accept data for non-element nodes in modern browsers, + // but we should not, see #8335. + // Always return an empty object. + if ( acceptData( owner ) ) { + + // If it is a node unlikely to be stringify-ed or looped over + // use plain assignment + if ( owner.nodeType ) { + owner[ this.expando ] = value; + + // Otherwise secure it in a non-enumerable property + // configurable must be true to allow the property to be + // deleted when data is removed + } else { + Object.defineProperty( owner, this.expando, { + value: value, + configurable: true + } ); + } + } + } + + return value; + }, + set: function( owner, data, value ) { + var prop, + cache = this.cache( owner ); + + // Handle: [ owner, key, value ] args + // Always use camelCase key (gh-2257) + if ( typeof data === "string" ) { + cache[ camelCase( data ) ] = value; + + // Handle: [ owner, { properties } ] args + } else { + + // Copy the properties one-by-one to the cache object + for ( prop in data ) { + cache[ camelCase( prop ) ] = data[ prop ]; + } + } + return cache; + }, + get: function( owner, key ) { + return key === undefined ? + this.cache( owner ) : + + // Always use camelCase key (gh-2257) + owner[ this.expando ] && owner[ this.expando ][ camelCase( key ) ]; + }, + access: function( owner, key, value ) { + + // In cases where either: + // + // 1. No key was specified + // 2. A string key was specified, but no value provided + // + // Take the "read" path and allow the get method to determine + // which value to return, respectively either: + // + // 1. The entire cache object + // 2. The data stored at the key + // + if ( key === undefined || + ( ( key && typeof key === "string" ) && value === undefined ) ) { + + return this.get( owner, key ); + } + + // When the key is not a string, or both a key and value + // are specified, set or extend (existing objects) with either: + // + // 1. An object of properties + // 2. A key and value + // + this.set( owner, key, value ); + + // Since the "set" path can have two possible entry points + // return the expected data based on which path was taken[*] + return value !== undefined ? value : key; + }, + remove: function( owner, key ) { + var i, + cache = owner[ this.expando ]; + + if ( cache === undefined ) { + return; + } + + if ( key !== undefined ) { + + // Support array or space separated string of keys + if ( Array.isArray( key ) ) { + + // If key is an array of keys... + // We always set camelCase keys, so remove that. + key = key.map( camelCase ); + } else { + key = camelCase( key ); + + // If a key with the spaces exists, use it. + // Otherwise, create an array by matching non-whitespace + key = key in cache ? + [ key ] : + ( key.match( rnothtmlwhite ) || [] ); + } + + i = key.length; + + while ( i-- ) { + delete cache[ key[ i ] ]; + } + } + + // Remove the expando if there's no more data + if ( key === undefined || jQuery.isEmptyObject( cache ) ) { + + // Support: Chrome <=35 - 45 + // Webkit & Blink performance suffers when deleting properties + // from DOM nodes, so set to undefined instead + // https://bugs.chromium.org/p/chromium/issues/detail?id=378607 (bug restricted) + if ( owner.nodeType ) { + owner[ this.expando ] = undefined; + } else { + delete owner[ this.expando ]; + } + } + }, + hasData: function( owner ) { + var cache = owner[ this.expando ]; + return cache !== undefined && !jQuery.isEmptyObject( cache ); + } +}; +var dataPriv = new Data(); + +var dataUser = new Data(); + + + +// Implementation Summary +// +// 1. Enforce API surface and semantic compatibility with 1.9.x branch +// 2. Improve the module's maintainability by reducing the storage +// paths to a single mechanism. +// 3. Use the same single mechanism to support "private" and "user" data. +// 4. _Never_ expose "private" data to user code (TODO: Drop _data, _removeData) +// 5. Avoid exposing implementation details on user objects (eg. expando properties) +// 6. Provide a clear path for implementation upgrade to WeakMap in 2014 + +var rbrace = /^(?:\{[\w\W]*\}|\[[\w\W]*\])$/, + rmultiDash = /[A-Z]/g; + +function getData( data ) { + if ( data === "true" ) { + return true; + } + + if ( data === "false" ) { + return false; + } + + if ( data === "null" ) { + return null; + } + + // Only convert to a number if it doesn't change the string + if ( data === +data + "" ) { + return +data; + } + + if ( rbrace.test( data ) ) { + return JSON.parse( data ); + } + + return data; +} + +function dataAttr( elem, key, data ) { + var name; + + // If nothing was found internally, try to fetch any + // data from the HTML5 data-* attribute + if ( data === undefined && elem.nodeType === 1 ) { + name = "data-" + key.replace( rmultiDash, "-$&" ).toLowerCase(); + data = elem.getAttribute( name ); + + if ( typeof data === "string" ) { + try { + data = getData( data ); + } catch ( e ) {} + + // Make sure we set the data so it isn't changed later + dataUser.set( elem, key, data ); + } else { + data = undefined; + } + } + return data; +} + +jQuery.extend( { + hasData: function( elem ) { + return dataUser.hasData( elem ) || dataPriv.hasData( elem ); + }, + + data: function( elem, name, data ) { + return dataUser.access( elem, name, data ); + }, + + removeData: function( elem, name ) { + dataUser.remove( elem, name ); + }, + + // TODO: Now that all calls to _data and _removeData have been replaced + // with direct calls to dataPriv methods, these can be deprecated. + _data: function( elem, name, data ) { + return dataPriv.access( elem, name, data ); + }, + + _removeData: function( elem, name ) { + dataPriv.remove( elem, name ); + } +} ); + +jQuery.fn.extend( { + data: function( key, value ) { + var i, name, data, + elem = this[ 0 ], + attrs = elem && elem.attributes; + + // Gets all values + if ( key === undefined ) { + if ( this.length ) { + data = dataUser.get( elem ); + + if ( elem.nodeType === 1 && !dataPriv.get( elem, "hasDataAttrs" ) ) { + i = attrs.length; + while ( i-- ) { + + // Support: IE 11 only + // The attrs elements can be null (#14894) + if ( attrs[ i ] ) { + name = attrs[ i ].name; + if ( name.indexOf( "data-" ) === 0 ) { + name = camelCase( name.slice( 5 ) ); + dataAttr( elem, name, data[ name ] ); + } + } + } + dataPriv.set( elem, "hasDataAttrs", true ); + } + } + + return data; + } + + // Sets multiple values + if ( typeof key === "object" ) { + return this.each( function() { + dataUser.set( this, key ); + } ); + } + + return access( this, function( value ) { + var data; + + // The calling jQuery object (element matches) is not empty + // (and therefore has an element appears at this[ 0 ]) and the + // `value` parameter was not undefined. An empty jQuery object + // will result in `undefined` for elem = this[ 0 ] which will + // throw an exception if an attempt to read a data cache is made. + if ( elem && value === undefined ) { + + // Attempt to get data from the cache + // The key will always be camelCased in Data + data = dataUser.get( elem, key ); + if ( data !== undefined ) { + return data; + } + + // Attempt to "discover" the data in + // HTML5 custom data-* attrs + data = dataAttr( elem, key ); + if ( data !== undefined ) { + return data; + } + + // We tried really hard, but the data doesn't exist. + return; + } + + // Set the data... + this.each( function() { + + // We always store the camelCased key + dataUser.set( this, key, value ); + } ); + }, null, value, arguments.length > 1, null, true ); + }, + + removeData: function( key ) { + return this.each( function() { + dataUser.remove( this, key ); + } ); + } +} ); + + +jQuery.extend( { + queue: function( elem, type, data ) { + var queue; + + if ( elem ) { + type = ( type || "fx" ) + "queue"; + queue = dataPriv.get( elem, type ); + + // Speed up dequeue by getting out quickly if this is just a lookup + if ( data ) { + if ( !queue || Array.isArray( data ) ) { + queue = dataPriv.access( elem, type, jQuery.makeArray( data ) ); + } else { + queue.push( data ); + } + } + return queue || []; + } + }, + + dequeue: function( elem, type ) { + type = type || "fx"; + + var queue = jQuery.queue( elem, type ), + startLength = queue.length, + fn = queue.shift(), + hooks = jQuery._queueHooks( elem, type ), + next = function() { + jQuery.dequeue( elem, type ); + }; + + // If the fx queue is dequeued, always remove the progress sentinel + if ( fn === "inprogress" ) { + fn = queue.shift(); + startLength--; + } + + if ( fn ) { + + // Add a progress sentinel to prevent the fx queue from being + // automatically dequeued + if ( type === "fx" ) { + queue.unshift( "inprogress" ); + } + + // Clear up the last queue stop function + delete hooks.stop; + fn.call( elem, next, hooks ); + } + + if ( !startLength && hooks ) { + hooks.empty.fire(); + } + }, + + // Not public - generate a queueHooks object, or return the current one + _queueHooks: function( elem, type ) { + var key = type + "queueHooks"; + return dataPriv.get( elem, key ) || dataPriv.access( elem, key, { + empty: jQuery.Callbacks( "once memory" ).add( function() { + dataPriv.remove( elem, [ type + "queue", key ] ); + } ) + } ); + } +} ); + +jQuery.fn.extend( { + queue: function( type, data ) { + var setter = 2; + + if ( typeof type !== "string" ) { + data = type; + type = "fx"; + setter--; + } + + if ( arguments.length < setter ) { + return jQuery.queue( this[ 0 ], type ); + } + + return data === undefined ? + this : + this.each( function() { + var queue = jQuery.queue( this, type, data ); + + // Ensure a hooks for this queue + jQuery._queueHooks( this, type ); + + if ( type === "fx" && queue[ 0 ] !== "inprogress" ) { + jQuery.dequeue( this, type ); + } + } ); + }, + dequeue: function( type ) { + return this.each( function() { + jQuery.dequeue( this, type ); + } ); + }, + clearQueue: function( type ) { + return this.queue( type || "fx", [] ); + }, + + // Get a promise resolved when queues of a certain type + // are emptied (fx is the type by default) + promise: function( type, obj ) { + var tmp, + count = 1, + defer = jQuery.Deferred(), + elements = this, + i = this.length, + resolve = function() { + if ( !( --count ) ) { + defer.resolveWith( elements, [ elements ] ); + } + }; + + if ( typeof type !== "string" ) { + obj = type; + type = undefined; + } + type = type || "fx"; + + while ( i-- ) { + tmp = dataPriv.get( elements[ i ], type + "queueHooks" ); + if ( tmp && tmp.empty ) { + count++; + tmp.empty.add( resolve ); + } + } + resolve(); + return defer.promise( obj ); + } +} ); +var pnum = ( /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/ ).source; + +var rcssNum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" ); + + +var cssExpand = [ "Top", "Right", "Bottom", "Left" ]; + +var documentElement = document.documentElement; + + + + var isAttached = function( elem ) { + return jQuery.contains( elem.ownerDocument, elem ); + }, + composed = { composed: true }; + + // Support: IE 9 - 11+, Edge 12 - 18+, iOS 10.0 - 10.2 only + // Check attachment across shadow DOM boundaries when possible (gh-3504) + // Support: iOS 10.0-10.2 only + // Early iOS 10 versions support `attachShadow` but not `getRootNode`, + // leading to errors. We need to check for `getRootNode`. + if ( documentElement.getRootNode ) { + isAttached = function( elem ) { + return jQuery.contains( elem.ownerDocument, elem ) || + elem.getRootNode( composed ) === elem.ownerDocument; + }; + } +var isHiddenWithinTree = function( elem, el ) { + + // isHiddenWithinTree might be called from jQuery#filter function; + // in that case, element will be second argument + elem = el || elem; + + // Inline style trumps all + return elem.style.display === "none" || + elem.style.display === "" && + + // Otherwise, check computed style + // Support: Firefox <=43 - 45 + // Disconnected elements can have computed display: none, so first confirm that elem is + // in the document. + isAttached( elem ) && + + jQuery.css( elem, "display" ) === "none"; + }; + + + +function adjustCSS( elem, prop, valueParts, tween ) { + var adjusted, scale, + maxIterations = 20, + currentValue = tween ? + function() { + return tween.cur(); + } : + function() { + return jQuery.css( elem, prop, "" ); + }, + initial = currentValue(), + unit = valueParts && valueParts[ 3 ] || ( jQuery.cssNumber[ prop ] ? "" : "px" ), + + // Starting value computation is required for potential unit mismatches + initialInUnit = elem.nodeType && + ( jQuery.cssNumber[ prop ] || unit !== "px" && +initial ) && + rcssNum.exec( jQuery.css( elem, prop ) ); + + if ( initialInUnit && initialInUnit[ 3 ] !== unit ) { + + // Support: Firefox <=54 + // Halve the iteration target value to prevent interference from CSS upper bounds (gh-2144) + initial = initial / 2; + + // Trust units reported by jQuery.css + unit = unit || initialInUnit[ 3 ]; + + // Iteratively approximate from a nonzero starting point + initialInUnit = +initial || 1; + + while ( maxIterations-- ) { + + // Evaluate and update our best guess (doubling guesses that zero out). + // Finish if the scale equals or crosses 1 (making the old*new product non-positive). + jQuery.style( elem, prop, initialInUnit + unit ); + if ( ( 1 - scale ) * ( 1 - ( scale = currentValue() / initial || 0.5 ) ) <= 0 ) { + maxIterations = 0; + } + initialInUnit = initialInUnit / scale; + + } + + initialInUnit = initialInUnit * 2; + jQuery.style( elem, prop, initialInUnit + unit ); + + // Make sure we update the tween properties later on + valueParts = valueParts || []; + } + + if ( valueParts ) { + initialInUnit = +initialInUnit || +initial || 0; + + // Apply relative offset (+=/-=) if specified + adjusted = valueParts[ 1 ] ? + initialInUnit + ( valueParts[ 1 ] + 1 ) * valueParts[ 2 ] : + +valueParts[ 2 ]; + if ( tween ) { + tween.unit = unit; + tween.start = initialInUnit; + tween.end = adjusted; + } + } + return adjusted; +} + + +var defaultDisplayMap = {}; + +function getDefaultDisplay( elem ) { + var temp, + doc = elem.ownerDocument, + nodeName = elem.nodeName, + display = defaultDisplayMap[ nodeName ]; + + if ( display ) { + return display; + } + + temp = doc.body.appendChild( doc.createElement( nodeName ) ); + display = jQuery.css( temp, "display" ); + + temp.parentNode.removeChild( temp ); + + if ( display === "none" ) { + display = "block"; + } + defaultDisplayMap[ nodeName ] = display; + + return display; +} + +function showHide( elements, show ) { + var display, elem, + values = [], + index = 0, + length = elements.length; + + // Determine new display value for elements that need to change + for ( ; index < length; index++ ) { + elem = elements[ index ]; + if ( !elem.style ) { + continue; + } + + display = elem.style.display; + if ( show ) { + + // Since we force visibility upon cascade-hidden elements, an immediate (and slow) + // check is required in this first loop unless we have a nonempty display value (either + // inline or about-to-be-restored) + if ( display === "none" ) { + values[ index ] = dataPriv.get( elem, "display" ) || null; + if ( !values[ index ] ) { + elem.style.display = ""; + } + } + if ( elem.style.display === "" && isHiddenWithinTree( elem ) ) { + values[ index ] = getDefaultDisplay( elem ); + } + } else { + if ( display !== "none" ) { + values[ index ] = "none"; + + // Remember what we're overwriting + dataPriv.set( elem, "display", display ); + } + } + } + + // Set the display of the elements in a second loop to avoid constant reflow + for ( index = 0; index < length; index++ ) { + if ( values[ index ] != null ) { + elements[ index ].style.display = values[ index ]; + } + } + + return elements; +} + +jQuery.fn.extend( { + show: function() { + return showHide( this, true ); + }, + hide: function() { + return showHide( this ); + }, + toggle: function( state ) { + if ( typeof state === "boolean" ) { + return state ? this.show() : this.hide(); + } + + return this.each( function() { + if ( isHiddenWithinTree( this ) ) { + jQuery( this ).show(); + } else { + jQuery( this ).hide(); + } + } ); + } +} ); +var rcheckableType = ( /^(?:checkbox|radio)$/i ); + +var rtagName = ( /<([a-z][^\/\0>\x20\t\r\n\f]*)/i ); + +var rscriptType = ( /^$|^module$|\/(?:java|ecma)script/i ); + + + +( function() { + var fragment = document.createDocumentFragment(), + div = fragment.appendChild( document.createElement( "div" ) ), + input = document.createElement( "input" ); + + // Support: Android 4.0 - 4.3 only + // Check state lost if the name is set (#11217) + // Support: Windows Web Apps (WWA) + // `name` and `type` must use .setAttribute for WWA (#14901) + input.setAttribute( "type", "radio" ); + input.setAttribute( "checked", "checked" ); + input.setAttribute( "name", "t" ); + + div.appendChild( input ); + + // Support: Android <=4.1 only + // Older WebKit doesn't clone checked state correctly in fragments + support.checkClone = div.cloneNode( true ).cloneNode( true ).lastChild.checked; + + // Support: IE <=11 only + // Make sure textarea (and checkbox) defaultValue is properly cloned + div.innerHTML = ""; + support.noCloneChecked = !!div.cloneNode( true ).lastChild.defaultValue; + + // Support: IE <=9 only + // IE <=9 replaces "; + support.option = !!div.lastChild; +} )(); + + +// We have to close these tags to support XHTML (#13200) +var wrapMap = { + + // XHTML parsers do not magically insert elements in the + // same way that tag soup parsers do. So we cannot shorten + // this by omitting or other required elements. + thead: [ 1, "", "
                " ], + col: [ 2, "", "
                " ], + tr: [ 2, "", "
                " ], + td: [ 3, "", "
                " ], + + _default: [ 0, "", "" ] +}; + +wrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead; +wrapMap.th = wrapMap.td; + +// Support: IE <=9 only +if ( !support.option ) { + wrapMap.optgroup = wrapMap.option = [ 1, "" ]; +} + + +function getAll( context, tag ) { + + // Support: IE <=9 - 11 only + // Use typeof to avoid zero-argument method invocation on host objects (#15151) + var ret; + + if ( typeof context.getElementsByTagName !== "undefined" ) { + ret = context.getElementsByTagName( tag || "*" ); + + } else if ( typeof context.querySelectorAll !== "undefined" ) { + ret = context.querySelectorAll( tag || "*" ); + + } else { + ret = []; + } + + if ( tag === undefined || tag && nodeName( context, tag ) ) { + return jQuery.merge( [ context ], ret ); + } + + return ret; +} + + +// Mark scripts as having already been evaluated +function setGlobalEval( elems, refElements ) { + var i = 0, + l = elems.length; + + for ( ; i < l; i++ ) { + dataPriv.set( + elems[ i ], + "globalEval", + !refElements || dataPriv.get( refElements[ i ], "globalEval" ) + ); + } +} + + +var rhtml = /<|&#?\w+;/; + +function buildFragment( elems, context, scripts, selection, ignored ) { + var elem, tmp, tag, wrap, attached, j, + fragment = context.createDocumentFragment(), + nodes = [], + i = 0, + l = elems.length; + + for ( ; i < l; i++ ) { + elem = elems[ i ]; + + if ( elem || elem === 0 ) { + + // Add nodes directly + if ( toType( elem ) === "object" ) { + + // Support: Android <=4.0 only, PhantomJS 1 only + // push.apply(_, arraylike) throws on ancient WebKit + jQuery.merge( nodes, elem.nodeType ? [ elem ] : elem ); + + // Convert non-html into a text node + } else if ( !rhtml.test( elem ) ) { + nodes.push( context.createTextNode( elem ) ); + + // Convert html into DOM nodes + } else { + tmp = tmp || fragment.appendChild( context.createElement( "div" ) ); + + // Deserialize a standard representation + tag = ( rtagName.exec( elem ) || [ "", "" ] )[ 1 ].toLowerCase(); + wrap = wrapMap[ tag ] || wrapMap._default; + tmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ]; + + // Descend through wrappers to the right content + j = wrap[ 0 ]; + while ( j-- ) { + tmp = tmp.lastChild; + } + + // Support: Android <=4.0 only, PhantomJS 1 only + // push.apply(_, arraylike) throws on ancient WebKit + jQuery.merge( nodes, tmp.childNodes ); + + // Remember the top-level container + tmp = fragment.firstChild; + + // Ensure the created nodes are orphaned (#12392) + tmp.textContent = ""; + } + } + } + + // Remove wrapper from fragment + fragment.textContent = ""; + + i = 0; + while ( ( elem = nodes[ i++ ] ) ) { + + // Skip elements already in the context collection (trac-4087) + if ( selection && jQuery.inArray( elem, selection ) > -1 ) { + if ( ignored ) { + ignored.push( elem ); + } + continue; + } + + attached = isAttached( elem ); + + // Append to fragment + tmp = getAll( fragment.appendChild( elem ), "script" ); + + // Preserve script evaluation history + if ( attached ) { + setGlobalEval( tmp ); + } + + // Capture executables + if ( scripts ) { + j = 0; + while ( ( elem = tmp[ j++ ] ) ) { + if ( rscriptType.test( elem.type || "" ) ) { + scripts.push( elem ); + } + } + } + } + + return fragment; +} + + +var + rkeyEvent = /^key/, + rmouseEvent = /^(?:mouse|pointer|contextmenu|drag|drop)|click/, + rtypenamespace = /^([^.]*)(?:\.(.+)|)/; + +function returnTrue() { + return true; +} + +function returnFalse() { + return false; +} + +// Support: IE <=9 - 11+ +// focus() and blur() are asynchronous, except when they are no-op. +// So expect focus to be synchronous when the element is already active, +// and blur to be synchronous when the element is not already active. +// (focus and blur are always synchronous in other supported browsers, +// this just defines when we can count on it). +function expectSync( elem, type ) { + return ( elem === safeActiveElement() ) === ( type === "focus" ); +} + +// Support: IE <=9 only +// Accessing document.activeElement can throw unexpectedly +// https://bugs.jquery.com/ticket/13393 +function safeActiveElement() { + try { + return document.activeElement; + } catch ( err ) { } +} + +function on( elem, types, selector, data, fn, one ) { + var origFn, type; + + // Types can be a map of types/handlers + if ( typeof types === "object" ) { + + // ( types-Object, selector, data ) + if ( typeof selector !== "string" ) { + + // ( types-Object, data ) + data = data || selector; + selector = undefined; + } + for ( type in types ) { + on( elem, type, selector, data, types[ type ], one ); + } + return elem; + } + + if ( data == null && fn == null ) { + + // ( types, fn ) + fn = selector; + data = selector = undefined; + } else if ( fn == null ) { + if ( typeof selector === "string" ) { + + // ( types, selector, fn ) + fn = data; + data = undefined; + } else { + + // ( types, data, fn ) + fn = data; + data = selector; + selector = undefined; + } + } + if ( fn === false ) { + fn = returnFalse; + } else if ( !fn ) { + return elem; + } + + if ( one === 1 ) { + origFn = fn; + fn = function( event ) { + + // Can use an empty set, since event contains the info + jQuery().off( event ); + return origFn.apply( this, arguments ); + }; + + // Use same guid so caller can remove using origFn + fn.guid = origFn.guid || ( origFn.guid = jQuery.guid++ ); + } + return elem.each( function() { + jQuery.event.add( this, types, fn, data, selector ); + } ); +} + +/* + * Helper functions for managing events -- not part of the public interface. + * Props to Dean Edwards' addEvent library for many of the ideas. + */ +jQuery.event = { + + global: {}, + + add: function( elem, types, handler, data, selector ) { + + var handleObjIn, eventHandle, tmp, + events, t, handleObj, + special, handlers, type, namespaces, origType, + elemData = dataPriv.get( elem ); + + // Only attach events to objects that accept data + if ( !acceptData( elem ) ) { + return; + } + + // Caller can pass in an object of custom data in lieu of the handler + if ( handler.handler ) { + handleObjIn = handler; + handler = handleObjIn.handler; + selector = handleObjIn.selector; + } + + // Ensure that invalid selectors throw exceptions at attach time + // Evaluate against documentElement in case elem is a non-element node (e.g., document) + if ( selector ) { + jQuery.find.matchesSelector( documentElement, selector ); + } + + // Make sure that the handler has a unique ID, used to find/remove it later + if ( !handler.guid ) { + handler.guid = jQuery.guid++; + } + + // Init the element's event structure and main handler, if this is the first + if ( !( events = elemData.events ) ) { + events = elemData.events = Object.create( null ); + } + if ( !( eventHandle = elemData.handle ) ) { + eventHandle = elemData.handle = function( e ) { + + // Discard the second event of a jQuery.event.trigger() and + // when an event is called after a page has unloaded + return typeof jQuery !== "undefined" && jQuery.event.triggered !== e.type ? + jQuery.event.dispatch.apply( elem, arguments ) : undefined; + }; + } + + // Handle multiple events separated by a space + types = ( types || "" ).match( rnothtmlwhite ) || [ "" ]; + t = types.length; + while ( t-- ) { + tmp = rtypenamespace.exec( types[ t ] ) || []; + type = origType = tmp[ 1 ]; + namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort(); + + // There *must* be a type, no attaching namespace-only handlers + if ( !type ) { + continue; + } + + // If event changes its type, use the special event handlers for the changed type + special = jQuery.event.special[ type ] || {}; + + // If selector defined, determine special event api type, otherwise given type + type = ( selector ? special.delegateType : special.bindType ) || type; + + // Update special based on newly reset type + special = jQuery.event.special[ type ] || {}; + + // handleObj is passed to all event handlers + handleObj = jQuery.extend( { + type: type, + origType: origType, + data: data, + handler: handler, + guid: handler.guid, + selector: selector, + needsContext: selector && jQuery.expr.match.needsContext.test( selector ), + namespace: namespaces.join( "." ) + }, handleObjIn ); + + // Init the event handler queue if we're the first + if ( !( handlers = events[ type ] ) ) { + handlers = events[ type ] = []; + handlers.delegateCount = 0; + + // Only use addEventListener if the special events handler returns false + if ( !special.setup || + special.setup.call( elem, data, namespaces, eventHandle ) === false ) { + + if ( elem.addEventListener ) { + elem.addEventListener( type, eventHandle ); + } + } + } + + if ( special.add ) { + special.add.call( elem, handleObj ); + + if ( !handleObj.handler.guid ) { + handleObj.handler.guid = handler.guid; + } + } + + // Add to the element's handler list, delegates in front + if ( selector ) { + handlers.splice( handlers.delegateCount++, 0, handleObj ); + } else { + handlers.push( handleObj ); + } + + // Keep track of which events have ever been used, for event optimization + jQuery.event.global[ type ] = true; + } + + }, + + // Detach an event or set of events from an element + remove: function( elem, types, handler, selector, mappedTypes ) { + + var j, origCount, tmp, + events, t, handleObj, + special, handlers, type, namespaces, origType, + elemData = dataPriv.hasData( elem ) && dataPriv.get( elem ); + + if ( !elemData || !( events = elemData.events ) ) { + return; + } + + // Once for each type.namespace in types; type may be omitted + types = ( types || "" ).match( rnothtmlwhite ) || [ "" ]; + t = types.length; + while ( t-- ) { + tmp = rtypenamespace.exec( types[ t ] ) || []; + type = origType = tmp[ 1 ]; + namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort(); + + // Unbind all events (on this namespace, if provided) for the element + if ( !type ) { + for ( type in events ) { + jQuery.event.remove( elem, type + types[ t ], handler, selector, true ); + } + continue; + } + + special = jQuery.event.special[ type ] || {}; + type = ( selector ? special.delegateType : special.bindType ) || type; + handlers = events[ type ] || []; + tmp = tmp[ 2 ] && + new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" ); + + // Remove matching events + origCount = j = handlers.length; + while ( j-- ) { + handleObj = handlers[ j ]; + + if ( ( mappedTypes || origType === handleObj.origType ) && + ( !handler || handler.guid === handleObj.guid ) && + ( !tmp || tmp.test( handleObj.namespace ) ) && + ( !selector || selector === handleObj.selector || + selector === "**" && handleObj.selector ) ) { + handlers.splice( j, 1 ); + + if ( handleObj.selector ) { + handlers.delegateCount--; + } + if ( special.remove ) { + special.remove.call( elem, handleObj ); + } + } + } + + // Remove generic event handler if we removed something and no more handlers exist + // (avoids potential for endless recursion during removal of special event handlers) + if ( origCount && !handlers.length ) { + if ( !special.teardown || + special.teardown.call( elem, namespaces, elemData.handle ) === false ) { + + jQuery.removeEvent( elem, type, elemData.handle ); + } + + delete events[ type ]; + } + } + + // Remove data and the expando if it's no longer used + if ( jQuery.isEmptyObject( events ) ) { + dataPriv.remove( elem, "handle events" ); + } + }, + + dispatch: function( nativeEvent ) { + + var i, j, ret, matched, handleObj, handlerQueue, + args = new Array( arguments.length ), + + // Make a writable jQuery.Event from the native event object + event = jQuery.event.fix( nativeEvent ), + + handlers = ( + dataPriv.get( this, "events" ) || Object.create( null ) + )[ event.type ] || [], + special = jQuery.event.special[ event.type ] || {}; + + // Use the fix-ed jQuery.Event rather than the (read-only) native event + args[ 0 ] = event; + + for ( i = 1; i < arguments.length; i++ ) { + args[ i ] = arguments[ i ]; + } + + event.delegateTarget = this; + + // Call the preDispatch hook for the mapped type, and let it bail if desired + if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) { + return; + } + + // Determine handlers + handlerQueue = jQuery.event.handlers.call( this, event, handlers ); + + // Run delegates first; they may want to stop propagation beneath us + i = 0; + while ( ( matched = handlerQueue[ i++ ] ) && !event.isPropagationStopped() ) { + event.currentTarget = matched.elem; + + j = 0; + while ( ( handleObj = matched.handlers[ j++ ] ) && + !event.isImmediatePropagationStopped() ) { + + // If the event is namespaced, then each handler is only invoked if it is + // specially universal or its namespaces are a superset of the event's. + if ( !event.rnamespace || handleObj.namespace === false || + event.rnamespace.test( handleObj.namespace ) ) { + + event.handleObj = handleObj; + event.data = handleObj.data; + + ret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle || + handleObj.handler ).apply( matched.elem, args ); + + if ( ret !== undefined ) { + if ( ( event.result = ret ) === false ) { + event.preventDefault(); + event.stopPropagation(); + } + } + } + } + } + + // Call the postDispatch hook for the mapped type + if ( special.postDispatch ) { + special.postDispatch.call( this, event ); + } + + return event.result; + }, + + handlers: function( event, handlers ) { + var i, handleObj, sel, matchedHandlers, matchedSelectors, + handlerQueue = [], + delegateCount = handlers.delegateCount, + cur = event.target; + + // Find delegate handlers + if ( delegateCount && + + // Support: IE <=9 + // Black-hole SVG instance trees (trac-13180) + cur.nodeType && + + // Support: Firefox <=42 + // Suppress spec-violating clicks indicating a non-primary pointer button (trac-3861) + // https://www.w3.org/TR/DOM-Level-3-Events/#event-type-click + // Support: IE 11 only + // ...but not arrow key "clicks" of radio inputs, which can have `button` -1 (gh-2343) + !( event.type === "click" && event.button >= 1 ) ) { + + for ( ; cur !== this; cur = cur.parentNode || this ) { + + // Don't check non-elements (#13208) + // Don't process clicks on disabled elements (#6911, #8165, #11382, #11764) + if ( cur.nodeType === 1 && !( event.type === "click" && cur.disabled === true ) ) { + matchedHandlers = []; + matchedSelectors = {}; + for ( i = 0; i < delegateCount; i++ ) { + handleObj = handlers[ i ]; + + // Don't conflict with Object.prototype properties (#13203) + sel = handleObj.selector + " "; + + if ( matchedSelectors[ sel ] === undefined ) { + matchedSelectors[ sel ] = handleObj.needsContext ? + jQuery( sel, this ).index( cur ) > -1 : + jQuery.find( sel, this, null, [ cur ] ).length; + } + if ( matchedSelectors[ sel ] ) { + matchedHandlers.push( handleObj ); + } + } + if ( matchedHandlers.length ) { + handlerQueue.push( { elem: cur, handlers: matchedHandlers } ); + } + } + } + } + + // Add the remaining (directly-bound) handlers + cur = this; + if ( delegateCount < handlers.length ) { + handlerQueue.push( { elem: cur, handlers: handlers.slice( delegateCount ) } ); + } + + return handlerQueue; + }, + + addProp: function( name, hook ) { + Object.defineProperty( jQuery.Event.prototype, name, { + enumerable: true, + configurable: true, + + get: isFunction( hook ) ? + function() { + if ( this.originalEvent ) { + return hook( this.originalEvent ); + } + } : + function() { + if ( this.originalEvent ) { + return this.originalEvent[ name ]; + } + }, + + set: function( value ) { + Object.defineProperty( this, name, { + enumerable: true, + configurable: true, + writable: true, + value: value + } ); + } + } ); + }, + + fix: function( originalEvent ) { + return originalEvent[ jQuery.expando ] ? + originalEvent : + new jQuery.Event( originalEvent ); + }, + + special: { + load: { + + // Prevent triggered image.load events from bubbling to window.load + noBubble: true + }, + click: { + + // Utilize native event to ensure correct state for checkable inputs + setup: function( data ) { + + // For mutual compressibility with _default, replace `this` access with a local var. + // `|| data` is dead code meant only to preserve the variable through minification. + var el = this || data; + + // Claim the first handler + if ( rcheckableType.test( el.type ) && + el.click && nodeName( el, "input" ) ) { + + // dataPriv.set( el, "click", ... ) + leverageNative( el, "click", returnTrue ); + } + + // Return false to allow normal processing in the caller + return false; + }, + trigger: function( data ) { + + // For mutual compressibility with _default, replace `this` access with a local var. + // `|| data` is dead code meant only to preserve the variable through minification. + var el = this || data; + + // Force setup before triggering a click + if ( rcheckableType.test( el.type ) && + el.click && nodeName( el, "input" ) ) { + + leverageNative( el, "click" ); + } + + // Return non-false to allow normal event-path propagation + return true; + }, + + // For cross-browser consistency, suppress native .click() on links + // Also prevent it if we're currently inside a leveraged native-event stack + _default: function( event ) { + var target = event.target; + return rcheckableType.test( target.type ) && + target.click && nodeName( target, "input" ) && + dataPriv.get( target, "click" ) || + nodeName( target, "a" ); + } + }, + + beforeunload: { + postDispatch: function( event ) { + + // Support: Firefox 20+ + // Firefox doesn't alert if the returnValue field is not set. + if ( event.result !== undefined && event.originalEvent ) { + event.originalEvent.returnValue = event.result; + } + } + } + } +}; + +// Ensure the presence of an event listener that handles manually-triggered +// synthetic events by interrupting progress until reinvoked in response to +// *native* events that it fires directly, ensuring that state changes have +// already occurred before other listeners are invoked. +function leverageNative( el, type, expectSync ) { + + // Missing expectSync indicates a trigger call, which must force setup through jQuery.event.add + if ( !expectSync ) { + if ( dataPriv.get( el, type ) === undefined ) { + jQuery.event.add( el, type, returnTrue ); + } + return; + } + + // Register the controller as a special universal handler for all event namespaces + dataPriv.set( el, type, false ); + jQuery.event.add( el, type, { + namespace: false, + handler: function( event ) { + var notAsync, result, + saved = dataPriv.get( this, type ); + + if ( ( event.isTrigger & 1 ) && this[ type ] ) { + + // Interrupt processing of the outer synthetic .trigger()ed event + // Saved data should be false in such cases, but might be a leftover capture object + // from an async native handler (gh-4350) + if ( !saved.length ) { + + // Store arguments for use when handling the inner native event + // There will always be at least one argument (an event object), so this array + // will not be confused with a leftover capture object. + saved = slice.call( arguments ); + dataPriv.set( this, type, saved ); + + // Trigger the native event and capture its result + // Support: IE <=9 - 11+ + // focus() and blur() are asynchronous + notAsync = expectSync( this, type ); + this[ type ](); + result = dataPriv.get( this, type ); + if ( saved !== result || notAsync ) { + dataPriv.set( this, type, false ); + } else { + result = {}; + } + if ( saved !== result ) { + + // Cancel the outer synthetic event + event.stopImmediatePropagation(); + event.preventDefault(); + return result.value; + } + + // If this is an inner synthetic event for an event with a bubbling surrogate + // (focus or blur), assume that the surrogate already propagated from triggering the + // native event and prevent that from happening again here. + // This technically gets the ordering wrong w.r.t. to `.trigger()` (in which the + // bubbling surrogate propagates *after* the non-bubbling base), but that seems + // less bad than duplication. + } else if ( ( jQuery.event.special[ type ] || {} ).delegateType ) { + event.stopPropagation(); + } + + // If this is a native event triggered above, everything is now in order + // Fire an inner synthetic event with the original arguments + } else if ( saved.length ) { + + // ...and capture the result + dataPriv.set( this, type, { + value: jQuery.event.trigger( + + // Support: IE <=9 - 11+ + // Extend with the prototype to reset the above stopImmediatePropagation() + jQuery.extend( saved[ 0 ], jQuery.Event.prototype ), + saved.slice( 1 ), + this + ) + } ); + + // Abort handling of the native event + event.stopImmediatePropagation(); + } + } + } ); +} + +jQuery.removeEvent = function( elem, type, handle ) { + + // This "if" is needed for plain objects + if ( elem.removeEventListener ) { + elem.removeEventListener( type, handle ); + } +}; + +jQuery.Event = function( src, props ) { + + // Allow instantiation without the 'new' keyword + if ( !( this instanceof jQuery.Event ) ) { + return new jQuery.Event( src, props ); + } + + // Event object + if ( src && src.type ) { + this.originalEvent = src; + this.type = src.type; + + // Events bubbling up the document may have been marked as prevented + // by a handler lower down the tree; reflect the correct value. + this.isDefaultPrevented = src.defaultPrevented || + src.defaultPrevented === undefined && + + // Support: Android <=2.3 only + src.returnValue === false ? + returnTrue : + returnFalse; + + // Create target properties + // Support: Safari <=6 - 7 only + // Target should not be a text node (#504, #13143) + this.target = ( src.target && src.target.nodeType === 3 ) ? + src.target.parentNode : + src.target; + + this.currentTarget = src.currentTarget; + this.relatedTarget = src.relatedTarget; + + // Event type + } else { + this.type = src; + } + + // Put explicitly provided properties onto the event object + if ( props ) { + jQuery.extend( this, props ); + } + + // Create a timestamp if incoming event doesn't have one + this.timeStamp = src && src.timeStamp || Date.now(); + + // Mark it as fixed + this[ jQuery.expando ] = true; +}; + +// jQuery.Event is based on DOM3 Events as specified by the ECMAScript Language Binding +// https://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html +jQuery.Event.prototype = { + constructor: jQuery.Event, + isDefaultPrevented: returnFalse, + isPropagationStopped: returnFalse, + isImmediatePropagationStopped: returnFalse, + isSimulated: false, + + preventDefault: function() { + var e = this.originalEvent; + + this.isDefaultPrevented = returnTrue; + + if ( e && !this.isSimulated ) { + e.preventDefault(); + } + }, + stopPropagation: function() { + var e = this.originalEvent; + + this.isPropagationStopped = returnTrue; + + if ( e && !this.isSimulated ) { + e.stopPropagation(); + } + }, + stopImmediatePropagation: function() { + var e = this.originalEvent; + + this.isImmediatePropagationStopped = returnTrue; + + if ( e && !this.isSimulated ) { + e.stopImmediatePropagation(); + } + + this.stopPropagation(); + } +}; + +// Includes all common event props including KeyEvent and MouseEvent specific props +jQuery.each( { + altKey: true, + bubbles: true, + cancelable: true, + changedTouches: true, + ctrlKey: true, + detail: true, + eventPhase: true, + metaKey: true, + pageX: true, + pageY: true, + shiftKey: true, + view: true, + "char": true, + code: true, + charCode: true, + key: true, + keyCode: true, + button: true, + buttons: true, + clientX: true, + clientY: true, + offsetX: true, + offsetY: true, + pointerId: true, + pointerType: true, + screenX: true, + screenY: true, + targetTouches: true, + toElement: true, + touches: true, + + which: function( event ) { + var button = event.button; + + // Add which for key events + if ( event.which == null && rkeyEvent.test( event.type ) ) { + return event.charCode != null ? event.charCode : event.keyCode; + } + + // Add which for click: 1 === left; 2 === middle; 3 === right + if ( !event.which && button !== undefined && rmouseEvent.test( event.type ) ) { + if ( button & 1 ) { + return 1; + } + + if ( button & 2 ) { + return 3; + } + + if ( button & 4 ) { + return 2; + } + + return 0; + } + + return event.which; + } +}, jQuery.event.addProp ); + +jQuery.each( { focus: "focusin", blur: "focusout" }, function( type, delegateType ) { + jQuery.event.special[ type ] = { + + // Utilize native event if possible so blur/focus sequence is correct + setup: function() { + + // Claim the first handler + // dataPriv.set( this, "focus", ... ) + // dataPriv.set( this, "blur", ... ) + leverageNative( this, type, expectSync ); + + // Return false to allow normal processing in the caller + return false; + }, + trigger: function() { + + // Force setup before trigger + leverageNative( this, type ); + + // Return non-false to allow normal event-path propagation + return true; + }, + + delegateType: delegateType + }; +} ); + +// Create mouseenter/leave events using mouseover/out and event-time checks +// so that event delegation works in jQuery. +// Do the same for pointerenter/pointerleave and pointerover/pointerout +// +// Support: Safari 7 only +// Safari sends mouseenter too often; see: +// https://bugs.chromium.org/p/chromium/issues/detail?id=470258 +// for the description of the bug (it existed in older Chrome versions as well). +jQuery.each( { + mouseenter: "mouseover", + mouseleave: "mouseout", + pointerenter: "pointerover", + pointerleave: "pointerout" +}, function( orig, fix ) { + jQuery.event.special[ orig ] = { + delegateType: fix, + bindType: fix, + + handle: function( event ) { + var ret, + target = this, + related = event.relatedTarget, + handleObj = event.handleObj; + + // For mouseenter/leave call the handler if related is outside the target. + // NB: No relatedTarget if the mouse left/entered the browser window + if ( !related || ( related !== target && !jQuery.contains( target, related ) ) ) { + event.type = handleObj.origType; + ret = handleObj.handler.apply( this, arguments ); + event.type = fix; + } + return ret; + } + }; +} ); + +jQuery.fn.extend( { + + on: function( types, selector, data, fn ) { + return on( this, types, selector, data, fn ); + }, + one: function( types, selector, data, fn ) { + return on( this, types, selector, data, fn, 1 ); + }, + off: function( types, selector, fn ) { + var handleObj, type; + if ( types && types.preventDefault && types.handleObj ) { + + // ( event ) dispatched jQuery.Event + handleObj = types.handleObj; + jQuery( types.delegateTarget ).off( + handleObj.namespace ? + handleObj.origType + "." + handleObj.namespace : + handleObj.origType, + handleObj.selector, + handleObj.handler + ); + return this; + } + if ( typeof types === "object" ) { + + // ( types-object [, selector] ) + for ( type in types ) { + this.off( type, selector, types[ type ] ); + } + return this; + } + if ( selector === false || typeof selector === "function" ) { + + // ( types [, fn] ) + fn = selector; + selector = undefined; + } + if ( fn === false ) { + fn = returnFalse; + } + return this.each( function() { + jQuery.event.remove( this, types, fn, selector ); + } ); + } +} ); + + +var + + // Support: IE <=10 - 11, Edge 12 - 13 only + // In IE/Edge using regex groups here causes severe slowdowns. + // See https://connect.microsoft.com/IE/feedback/details/1736512/ + rnoInnerhtml = /\s*$/g; + +// Prefer a tbody over its parent table for containing new rows +function manipulationTarget( elem, content ) { + if ( nodeName( elem, "table" ) && + nodeName( content.nodeType !== 11 ? content : content.firstChild, "tr" ) ) { + + return jQuery( elem ).children( "tbody" )[ 0 ] || elem; + } + + return elem; +} + +// Replace/restore the type attribute of script elements for safe DOM manipulation +function disableScript( elem ) { + elem.type = ( elem.getAttribute( "type" ) !== null ) + "/" + elem.type; + return elem; +} +function restoreScript( elem ) { + if ( ( elem.type || "" ).slice( 0, 5 ) === "true/" ) { + elem.type = elem.type.slice( 5 ); + } else { + elem.removeAttribute( "type" ); + } + + return elem; +} + +function cloneCopyEvent( src, dest ) { + var i, l, type, pdataOld, udataOld, udataCur, events; + + if ( dest.nodeType !== 1 ) { + return; + } + + // 1. Copy private data: events, handlers, etc. + if ( dataPriv.hasData( src ) ) { + pdataOld = dataPriv.get( src ); + events = pdataOld.events; + + if ( events ) { + dataPriv.remove( dest, "handle events" ); + + for ( type in events ) { + for ( i = 0, l = events[ type ].length; i < l; i++ ) { + jQuery.event.add( dest, type, events[ type ][ i ] ); + } + } + } + } + + // 2. Copy user data + if ( dataUser.hasData( src ) ) { + udataOld = dataUser.access( src ); + udataCur = jQuery.extend( {}, udataOld ); + + dataUser.set( dest, udataCur ); + } +} + +// Fix IE bugs, see support tests +function fixInput( src, dest ) { + var nodeName = dest.nodeName.toLowerCase(); + + // Fails to persist the checked state of a cloned checkbox or radio button. + if ( nodeName === "input" && rcheckableType.test( src.type ) ) { + dest.checked = src.checked; + + // Fails to return the selected option to the default selected state when cloning options + } else if ( nodeName === "input" || nodeName === "textarea" ) { + dest.defaultValue = src.defaultValue; + } +} + +function domManip( collection, args, callback, ignored ) { + + // Flatten any nested arrays + args = flat( args ); + + var fragment, first, scripts, hasScripts, node, doc, + i = 0, + l = collection.length, + iNoClone = l - 1, + value = args[ 0 ], + valueIsFunction = isFunction( value ); + + // We can't cloneNode fragments that contain checked, in WebKit + if ( valueIsFunction || + ( l > 1 && typeof value === "string" && + !support.checkClone && rchecked.test( value ) ) ) { + return collection.each( function( index ) { + var self = collection.eq( index ); + if ( valueIsFunction ) { + args[ 0 ] = value.call( this, index, self.html() ); + } + domManip( self, args, callback, ignored ); + } ); + } + + if ( l ) { + fragment = buildFragment( args, collection[ 0 ].ownerDocument, false, collection, ignored ); + first = fragment.firstChild; + + if ( fragment.childNodes.length === 1 ) { + fragment = first; + } + + // Require either new content or an interest in ignored elements to invoke the callback + if ( first || ignored ) { + scripts = jQuery.map( getAll( fragment, "script" ), disableScript ); + hasScripts = scripts.length; + + // Use the original fragment for the last item + // instead of the first because it can end up + // being emptied incorrectly in certain situations (#8070). + for ( ; i < l; i++ ) { + node = fragment; + + if ( i !== iNoClone ) { + node = jQuery.clone( node, true, true ); + + // Keep references to cloned scripts for later restoration + if ( hasScripts ) { + + // Support: Android <=4.0 only, PhantomJS 1 only + // push.apply(_, arraylike) throws on ancient WebKit + jQuery.merge( scripts, getAll( node, "script" ) ); + } + } + + callback.call( collection[ i ], node, i ); + } + + if ( hasScripts ) { + doc = scripts[ scripts.length - 1 ].ownerDocument; + + // Reenable scripts + jQuery.map( scripts, restoreScript ); + + // Evaluate executable scripts on first document insertion + for ( i = 0; i < hasScripts; i++ ) { + node = scripts[ i ]; + if ( rscriptType.test( node.type || "" ) && + !dataPriv.access( node, "globalEval" ) && + jQuery.contains( doc, node ) ) { + + if ( node.src && ( node.type || "" ).toLowerCase() !== "module" ) { + + // Optional AJAX dependency, but won't run scripts if not present + if ( jQuery._evalUrl && !node.noModule ) { + jQuery._evalUrl( node.src, { + nonce: node.nonce || node.getAttribute( "nonce" ) + }, doc ); + } + } else { + DOMEval( node.textContent.replace( rcleanScript, "" ), node, doc ); + } + } + } + } + } + } + + return collection; +} + +function remove( elem, selector, keepData ) { + var node, + nodes = selector ? jQuery.filter( selector, elem ) : elem, + i = 0; + + for ( ; ( node = nodes[ i ] ) != null; i++ ) { + if ( !keepData && node.nodeType === 1 ) { + jQuery.cleanData( getAll( node ) ); + } + + if ( node.parentNode ) { + if ( keepData && isAttached( node ) ) { + setGlobalEval( getAll( node, "script" ) ); + } + node.parentNode.removeChild( node ); + } + } + + return elem; +} + +jQuery.extend( { + htmlPrefilter: function( html ) { + return html; + }, + + clone: function( elem, dataAndEvents, deepDataAndEvents ) { + var i, l, srcElements, destElements, + clone = elem.cloneNode( true ), + inPage = isAttached( elem ); + + // Fix IE cloning issues + if ( !support.noCloneChecked && ( elem.nodeType === 1 || elem.nodeType === 11 ) && + !jQuery.isXMLDoc( elem ) ) { + + // We eschew Sizzle here for performance reasons: https://jsperf.com/getall-vs-sizzle/2 + destElements = getAll( clone ); + srcElements = getAll( elem ); + + for ( i = 0, l = srcElements.length; i < l; i++ ) { + fixInput( srcElements[ i ], destElements[ i ] ); + } + } + + // Copy the events from the original to the clone + if ( dataAndEvents ) { + if ( deepDataAndEvents ) { + srcElements = srcElements || getAll( elem ); + destElements = destElements || getAll( clone ); + + for ( i = 0, l = srcElements.length; i < l; i++ ) { + cloneCopyEvent( srcElements[ i ], destElements[ i ] ); + } + } else { + cloneCopyEvent( elem, clone ); + } + } + + // Preserve script evaluation history + destElements = getAll( clone, "script" ); + if ( destElements.length > 0 ) { + setGlobalEval( destElements, !inPage && getAll( elem, "script" ) ); + } + + // Return the cloned set + return clone; + }, + + cleanData: function( elems ) { + var data, elem, type, + special = jQuery.event.special, + i = 0; + + for ( ; ( elem = elems[ i ] ) !== undefined; i++ ) { + if ( acceptData( elem ) ) { + if ( ( data = elem[ dataPriv.expando ] ) ) { + if ( data.events ) { + for ( type in data.events ) { + if ( special[ type ] ) { + jQuery.event.remove( elem, type ); + + // This is a shortcut to avoid jQuery.event.remove's overhead + } else { + jQuery.removeEvent( elem, type, data.handle ); + } + } + } + + // Support: Chrome <=35 - 45+ + // Assign undefined instead of using delete, see Data#remove + elem[ dataPriv.expando ] = undefined; + } + if ( elem[ dataUser.expando ] ) { + + // Support: Chrome <=35 - 45+ + // Assign undefined instead of using delete, see Data#remove + elem[ dataUser.expando ] = undefined; + } + } + } + } +} ); + +jQuery.fn.extend( { + detach: function( selector ) { + return remove( this, selector, true ); + }, + + remove: function( selector ) { + return remove( this, selector ); + }, + + text: function( value ) { + return access( this, function( value ) { + return value === undefined ? + jQuery.text( this ) : + this.empty().each( function() { + if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) { + this.textContent = value; + } + } ); + }, null, value, arguments.length ); + }, + + append: function() { + return domManip( this, arguments, function( elem ) { + if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) { + var target = manipulationTarget( this, elem ); + target.appendChild( elem ); + } + } ); + }, + + prepend: function() { + return domManip( this, arguments, function( elem ) { + if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) { + var target = manipulationTarget( this, elem ); + target.insertBefore( elem, target.firstChild ); + } + } ); + }, + + before: function() { + return domManip( this, arguments, function( elem ) { + if ( this.parentNode ) { + this.parentNode.insertBefore( elem, this ); + } + } ); + }, + + after: function() { + return domManip( this, arguments, function( elem ) { + if ( this.parentNode ) { + this.parentNode.insertBefore( elem, this.nextSibling ); + } + } ); + }, + + empty: function() { + var elem, + i = 0; + + for ( ; ( elem = this[ i ] ) != null; i++ ) { + if ( elem.nodeType === 1 ) { + + // Prevent memory leaks + jQuery.cleanData( getAll( elem, false ) ); + + // Remove any remaining nodes + elem.textContent = ""; + } + } + + return this; + }, + + clone: function( dataAndEvents, deepDataAndEvents ) { + dataAndEvents = dataAndEvents == null ? false : dataAndEvents; + deepDataAndEvents = deepDataAndEvents == null ? dataAndEvents : deepDataAndEvents; + + return this.map( function() { + return jQuery.clone( this, dataAndEvents, deepDataAndEvents ); + } ); + }, + + html: function( value ) { + return access( this, function( value ) { + var elem = this[ 0 ] || {}, + i = 0, + l = this.length; + + if ( value === undefined && elem.nodeType === 1 ) { + return elem.innerHTML; + } + + // See if we can take a shortcut and just use innerHTML + if ( typeof value === "string" && !rnoInnerhtml.test( value ) && + !wrapMap[ ( rtagName.exec( value ) || [ "", "" ] )[ 1 ].toLowerCase() ] ) { + + value = jQuery.htmlPrefilter( value ); + + try { + for ( ; i < l; i++ ) { + elem = this[ i ] || {}; + + // Remove element nodes and prevent memory leaks + if ( elem.nodeType === 1 ) { + jQuery.cleanData( getAll( elem, false ) ); + elem.innerHTML = value; + } + } + + elem = 0; + + // If using innerHTML throws an exception, use the fallback method + } catch ( e ) {} + } + + if ( elem ) { + this.empty().append( value ); + } + }, null, value, arguments.length ); + }, + + replaceWith: function() { + var ignored = []; + + // Make the changes, replacing each non-ignored context element with the new content + return domManip( this, arguments, function( elem ) { + var parent = this.parentNode; + + if ( jQuery.inArray( this, ignored ) < 0 ) { + jQuery.cleanData( getAll( this ) ); + if ( parent ) { + parent.replaceChild( elem, this ); + } + } + + // Force callback invocation + }, ignored ); + } +} ); + +jQuery.each( { + appendTo: "append", + prependTo: "prepend", + insertBefore: "before", + insertAfter: "after", + replaceAll: "replaceWith" +}, function( name, original ) { + jQuery.fn[ name ] = function( selector ) { + var elems, + ret = [], + insert = jQuery( selector ), + last = insert.length - 1, + i = 0; + + for ( ; i <= last; i++ ) { + elems = i === last ? this : this.clone( true ); + jQuery( insert[ i ] )[ original ]( elems ); + + // Support: Android <=4.0 only, PhantomJS 1 only + // .get() because push.apply(_, arraylike) throws on ancient WebKit + push.apply( ret, elems.get() ); + } + + return this.pushStack( ret ); + }; +} ); +var rnumnonpx = new RegExp( "^(" + pnum + ")(?!px)[a-z%]+$", "i" ); + +var getStyles = function( elem ) { + + // Support: IE <=11 only, Firefox <=30 (#15098, #14150) + // IE throws on elements created in popups + // FF meanwhile throws on frame elements through "defaultView.getComputedStyle" + var view = elem.ownerDocument.defaultView; + + if ( !view || !view.opener ) { + view = window; + } + + return view.getComputedStyle( elem ); + }; + +var swap = function( elem, options, callback ) { + var ret, name, + old = {}; + + // Remember the old values, and insert the new ones + for ( name in options ) { + old[ name ] = elem.style[ name ]; + elem.style[ name ] = options[ name ]; + } + + ret = callback.call( elem ); + + // Revert the old values + for ( name in options ) { + elem.style[ name ] = old[ name ]; + } + + return ret; +}; + + +var rboxStyle = new RegExp( cssExpand.join( "|" ), "i" ); + + + +( function() { + + // Executing both pixelPosition & boxSizingReliable tests require only one layout + // so they're executed at the same time to save the second computation. + function computeStyleTests() { + + // This is a singleton, we need to execute it only once + if ( !div ) { + return; + } + + container.style.cssText = "position:absolute;left:-11111px;width:60px;" + + "margin-top:1px;padding:0;border:0"; + div.style.cssText = + "position:relative;display:block;box-sizing:border-box;overflow:scroll;" + + "margin:auto;border:1px;padding:1px;" + + "width:60%;top:1%"; + documentElement.appendChild( container ).appendChild( div ); + + var divStyle = window.getComputedStyle( div ); + pixelPositionVal = divStyle.top !== "1%"; + + // Support: Android 4.0 - 4.3 only, Firefox <=3 - 44 + reliableMarginLeftVal = roundPixelMeasures( divStyle.marginLeft ) === 12; + + // Support: Android 4.0 - 4.3 only, Safari <=9.1 - 10.1, iOS <=7.0 - 9.3 + // Some styles come back with percentage values, even though they shouldn't + div.style.right = "60%"; + pixelBoxStylesVal = roundPixelMeasures( divStyle.right ) === 36; + + // Support: IE 9 - 11 only + // Detect misreporting of content dimensions for box-sizing:border-box elements + boxSizingReliableVal = roundPixelMeasures( divStyle.width ) === 36; + + // Support: IE 9 only + // Detect overflow:scroll screwiness (gh-3699) + // Support: Chrome <=64 + // Don't get tricked when zoom affects offsetWidth (gh-4029) + div.style.position = "absolute"; + scrollboxSizeVal = roundPixelMeasures( div.offsetWidth / 3 ) === 12; + + documentElement.removeChild( container ); + + // Nullify the div so it wouldn't be stored in the memory and + // it will also be a sign that checks already performed + div = null; + } + + function roundPixelMeasures( measure ) { + return Math.round( parseFloat( measure ) ); + } + + var pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelBoxStylesVal, + reliableTrDimensionsVal, reliableMarginLeftVal, + container = document.createElement( "div" ), + div = document.createElement( "div" ); + + // Finish early in limited (non-browser) environments + if ( !div.style ) { + return; + } + + // Support: IE <=9 - 11 only + // Style of cloned element affects source element cloned (#8908) + div.style.backgroundClip = "content-box"; + div.cloneNode( true ).style.backgroundClip = ""; + support.clearCloneStyle = div.style.backgroundClip === "content-box"; + + jQuery.extend( support, { + boxSizingReliable: function() { + computeStyleTests(); + return boxSizingReliableVal; + }, + pixelBoxStyles: function() { + computeStyleTests(); + return pixelBoxStylesVal; + }, + pixelPosition: function() { + computeStyleTests(); + return pixelPositionVal; + }, + reliableMarginLeft: function() { + computeStyleTests(); + return reliableMarginLeftVal; + }, + scrollboxSize: function() { + computeStyleTests(); + return scrollboxSizeVal; + }, + + // Support: IE 9 - 11+, Edge 15 - 18+ + // IE/Edge misreport `getComputedStyle` of table rows with width/height + // set in CSS while `offset*` properties report correct values. + // Behavior in IE 9 is more subtle than in newer versions & it passes + // some versions of this test; make sure not to make it pass there! + reliableTrDimensions: function() { + var table, tr, trChild, trStyle; + if ( reliableTrDimensionsVal == null ) { + table = document.createElement( "table" ); + tr = document.createElement( "tr" ); + trChild = document.createElement( "div" ); + + table.style.cssText = "position:absolute;left:-11111px"; + tr.style.height = "1px"; + trChild.style.height = "9px"; + + documentElement + .appendChild( table ) + .appendChild( tr ) + .appendChild( trChild ); + + trStyle = window.getComputedStyle( tr ); + reliableTrDimensionsVal = parseInt( trStyle.height ) > 3; + + documentElement.removeChild( table ); + } + return reliableTrDimensionsVal; + } + } ); +} )(); + + +function curCSS( elem, name, computed ) { + var width, minWidth, maxWidth, ret, + + // Support: Firefox 51+ + // Retrieving style before computed somehow + // fixes an issue with getting wrong values + // on detached elements + style = elem.style; + + computed = computed || getStyles( elem ); + + // getPropertyValue is needed for: + // .css('filter') (IE 9 only, #12537) + // .css('--customProperty) (#3144) + if ( computed ) { + ret = computed.getPropertyValue( name ) || computed[ name ]; + + if ( ret === "" && !isAttached( elem ) ) { + ret = jQuery.style( elem, name ); + } + + // A tribute to the "awesome hack by Dean Edwards" + // Android Browser returns percentage for some values, + // but width seems to be reliably pixels. + // This is against the CSSOM draft spec: + // https://drafts.csswg.org/cssom/#resolved-values + if ( !support.pixelBoxStyles() && rnumnonpx.test( ret ) && rboxStyle.test( name ) ) { + + // Remember the original values + width = style.width; + minWidth = style.minWidth; + maxWidth = style.maxWidth; + + // Put in the new values to get a computed value out + style.minWidth = style.maxWidth = style.width = ret; + ret = computed.width; + + // Revert the changed values + style.width = width; + style.minWidth = minWidth; + style.maxWidth = maxWidth; + } + } + + return ret !== undefined ? + + // Support: IE <=9 - 11 only + // IE returns zIndex value as an integer. + ret + "" : + ret; +} + + +function addGetHookIf( conditionFn, hookFn ) { + + // Define the hook, we'll check on the first run if it's really needed. + return { + get: function() { + if ( conditionFn() ) { + + // Hook not needed (or it's not possible to use it due + // to missing dependency), remove it. + delete this.get; + return; + } + + // Hook needed; redefine it so that the support test is not executed again. + return ( this.get = hookFn ).apply( this, arguments ); + } + }; +} + + +var cssPrefixes = [ "Webkit", "Moz", "ms" ], + emptyStyle = document.createElement( "div" ).style, + vendorProps = {}; + +// Return a vendor-prefixed property or undefined +function vendorPropName( name ) { + + // Check for vendor prefixed names + var capName = name[ 0 ].toUpperCase() + name.slice( 1 ), + i = cssPrefixes.length; + + while ( i-- ) { + name = cssPrefixes[ i ] + capName; + if ( name in emptyStyle ) { + return name; + } + } +} + +// Return a potentially-mapped jQuery.cssProps or vendor prefixed property +function finalPropName( name ) { + var final = jQuery.cssProps[ name ] || vendorProps[ name ]; + + if ( final ) { + return final; + } + if ( name in emptyStyle ) { + return name; + } + return vendorProps[ name ] = vendorPropName( name ) || name; +} + + +var + + // Swappable if display is none or starts with table + // except "table", "table-cell", or "table-caption" + // See here for display values: https://developer.mozilla.org/en-US/docs/CSS/display + rdisplayswap = /^(none|table(?!-c[ea]).+)/, + rcustomProp = /^--/, + cssShow = { position: "absolute", visibility: "hidden", display: "block" }, + cssNormalTransform = { + letterSpacing: "0", + fontWeight: "400" + }; + +function setPositiveNumber( _elem, value, subtract ) { + + // Any relative (+/-) values have already been + // normalized at this point + var matches = rcssNum.exec( value ); + return matches ? + + // Guard against undefined "subtract", e.g., when used as in cssHooks + Math.max( 0, matches[ 2 ] - ( subtract || 0 ) ) + ( matches[ 3 ] || "px" ) : + value; +} + +function boxModelAdjustment( elem, dimension, box, isBorderBox, styles, computedVal ) { + var i = dimension === "width" ? 1 : 0, + extra = 0, + delta = 0; + + // Adjustment may not be necessary + if ( box === ( isBorderBox ? "border" : "content" ) ) { + return 0; + } + + for ( ; i < 4; i += 2 ) { + + // Both box models exclude margin + if ( box === "margin" ) { + delta += jQuery.css( elem, box + cssExpand[ i ], true, styles ); + } + + // If we get here with a content-box, we're seeking "padding" or "border" or "margin" + if ( !isBorderBox ) { + + // Add padding + delta += jQuery.css( elem, "padding" + cssExpand[ i ], true, styles ); + + // For "border" or "margin", add border + if ( box !== "padding" ) { + delta += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles ); + + // But still keep track of it otherwise + } else { + extra += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles ); + } + + // If we get here with a border-box (content + padding + border), we're seeking "content" or + // "padding" or "margin" + } else { + + // For "content", subtract padding + if ( box === "content" ) { + delta -= jQuery.css( elem, "padding" + cssExpand[ i ], true, styles ); + } + + // For "content" or "padding", subtract border + if ( box !== "margin" ) { + delta -= jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles ); + } + } + } + + // Account for positive content-box scroll gutter when requested by providing computedVal + if ( !isBorderBox && computedVal >= 0 ) { + + // offsetWidth/offsetHeight is a rounded sum of content, padding, scroll gutter, and border + // Assuming integer scroll gutter, subtract the rest and round down + delta += Math.max( 0, Math.ceil( + elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] - + computedVal - + delta - + extra - + 0.5 + + // If offsetWidth/offsetHeight is unknown, then we can't determine content-box scroll gutter + // Use an explicit zero to avoid NaN (gh-3964) + ) ) || 0; + } + + return delta; +} + +function getWidthOrHeight( elem, dimension, extra ) { + + // Start with computed style + var styles = getStyles( elem ), + + // To avoid forcing a reflow, only fetch boxSizing if we need it (gh-4322). + // Fake content-box until we know it's needed to know the true value. + boxSizingNeeded = !support.boxSizingReliable() || extra, + isBorderBox = boxSizingNeeded && + jQuery.css( elem, "boxSizing", false, styles ) === "border-box", + valueIsBorderBox = isBorderBox, + + val = curCSS( elem, dimension, styles ), + offsetProp = "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ); + + // Support: Firefox <=54 + // Return a confounding non-pixel value or feign ignorance, as appropriate. + if ( rnumnonpx.test( val ) ) { + if ( !extra ) { + return val; + } + val = "auto"; + } + + + // Support: IE 9 - 11 only + // Use offsetWidth/offsetHeight for when box sizing is unreliable. + // In those cases, the computed value can be trusted to be border-box. + if ( ( !support.boxSizingReliable() && isBorderBox || + + // Support: IE 10 - 11+, Edge 15 - 18+ + // IE/Edge misreport `getComputedStyle` of table rows with width/height + // set in CSS while `offset*` properties report correct values. + // Interestingly, in some cases IE 9 doesn't suffer from this issue. + !support.reliableTrDimensions() && nodeName( elem, "tr" ) || + + // Fall back to offsetWidth/offsetHeight when value is "auto" + // This happens for inline elements with no explicit setting (gh-3571) + val === "auto" || + + // Support: Android <=4.1 - 4.3 only + // Also use offsetWidth/offsetHeight for misreported inline dimensions (gh-3602) + !parseFloat( val ) && jQuery.css( elem, "display", false, styles ) === "inline" ) && + + // Make sure the element is visible & connected + elem.getClientRects().length ) { + + isBorderBox = jQuery.css( elem, "boxSizing", false, styles ) === "border-box"; + + // Where available, offsetWidth/offsetHeight approximate border box dimensions. + // Where not available (e.g., SVG), assume unreliable box-sizing and interpret the + // retrieved value as a content box dimension. + valueIsBorderBox = offsetProp in elem; + if ( valueIsBorderBox ) { + val = elem[ offsetProp ]; + } + } + + // Normalize "" and auto + val = parseFloat( val ) || 0; + + // Adjust for the element's box model + return ( val + + boxModelAdjustment( + elem, + dimension, + extra || ( isBorderBox ? "border" : "content" ), + valueIsBorderBox, + styles, + + // Provide the current computed size to request scroll gutter calculation (gh-3589) + val + ) + ) + "px"; +} + +jQuery.extend( { + + // Add in style property hooks for overriding the default + // behavior of getting and setting a style property + cssHooks: { + opacity: { + get: function( elem, computed ) { + if ( computed ) { + + // We should always get a number back from opacity + var ret = curCSS( elem, "opacity" ); + return ret === "" ? "1" : ret; + } + } + } + }, + + // Don't automatically add "px" to these possibly-unitless properties + cssNumber: { + "animationIterationCount": true, + "columnCount": true, + "fillOpacity": true, + "flexGrow": true, + "flexShrink": true, + "fontWeight": true, + "gridArea": true, + "gridColumn": true, + "gridColumnEnd": true, + "gridColumnStart": true, + "gridRow": true, + "gridRowEnd": true, + "gridRowStart": true, + "lineHeight": true, + "opacity": true, + "order": true, + "orphans": true, + "widows": true, + "zIndex": true, + "zoom": true + }, + + // Add in properties whose names you wish to fix before + // setting or getting the value + cssProps: {}, + + // Get and set the style property on a DOM Node + style: function( elem, name, value, extra ) { + + // Don't set styles on text and comment nodes + if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style ) { + return; + } + + // Make sure that we're working with the right name + var ret, type, hooks, + origName = camelCase( name ), + isCustomProp = rcustomProp.test( name ), + style = elem.style; + + // Make sure that we're working with the right name. We don't + // want to query the value if it is a CSS custom property + // since they are user-defined. + if ( !isCustomProp ) { + name = finalPropName( origName ); + } + + // Gets hook for the prefixed version, then unprefixed version + hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ]; + + // Check if we're setting a value + if ( value !== undefined ) { + type = typeof value; + + // Convert "+=" or "-=" to relative numbers (#7345) + if ( type === "string" && ( ret = rcssNum.exec( value ) ) && ret[ 1 ] ) { + value = adjustCSS( elem, name, ret ); + + // Fixes bug #9237 + type = "number"; + } + + // Make sure that null and NaN values aren't set (#7116) + if ( value == null || value !== value ) { + return; + } + + // If a number was passed in, add the unit (except for certain CSS properties) + // The isCustomProp check can be removed in jQuery 4.0 when we only auto-append + // "px" to a few hardcoded values. + if ( type === "number" && !isCustomProp ) { + value += ret && ret[ 3 ] || ( jQuery.cssNumber[ origName ] ? "" : "px" ); + } + + // background-* props affect original clone's values + if ( !support.clearCloneStyle && value === "" && name.indexOf( "background" ) === 0 ) { + style[ name ] = "inherit"; + } + + // If a hook was provided, use that value, otherwise just set the specified value + if ( !hooks || !( "set" in hooks ) || + ( value = hooks.set( elem, value, extra ) ) !== undefined ) { + + if ( isCustomProp ) { + style.setProperty( name, value ); + } else { + style[ name ] = value; + } + } + + } else { + + // If a hook was provided get the non-computed value from there + if ( hooks && "get" in hooks && + ( ret = hooks.get( elem, false, extra ) ) !== undefined ) { + + return ret; + } + + // Otherwise just get the value from the style object + return style[ name ]; + } + }, + + css: function( elem, name, extra, styles ) { + var val, num, hooks, + origName = camelCase( name ), + isCustomProp = rcustomProp.test( name ); + + // Make sure that we're working with the right name. We don't + // want to modify the value if it is a CSS custom property + // since they are user-defined. + if ( !isCustomProp ) { + name = finalPropName( origName ); + } + + // Try prefixed name followed by the unprefixed name + hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ]; + + // If a hook was provided get the computed value from there + if ( hooks && "get" in hooks ) { + val = hooks.get( elem, true, extra ); + } + + // Otherwise, if a way to get the computed value exists, use that + if ( val === undefined ) { + val = curCSS( elem, name, styles ); + } + + // Convert "normal" to computed value + if ( val === "normal" && name in cssNormalTransform ) { + val = cssNormalTransform[ name ]; + } + + // Make numeric if forced or a qualifier was provided and val looks numeric + if ( extra === "" || extra ) { + num = parseFloat( val ); + return extra === true || isFinite( num ) ? num || 0 : val; + } + + return val; + } +} ); + +jQuery.each( [ "height", "width" ], function( _i, dimension ) { + jQuery.cssHooks[ dimension ] = { + get: function( elem, computed, extra ) { + if ( computed ) { + + // Certain elements can have dimension info if we invisibly show them + // but it must have a current display style that would benefit + return rdisplayswap.test( jQuery.css( elem, "display" ) ) && + + // Support: Safari 8+ + // Table columns in Safari have non-zero offsetWidth & zero + // getBoundingClientRect().width unless display is changed. + // Support: IE <=11 only + // Running getBoundingClientRect on a disconnected node + // in IE throws an error. + ( !elem.getClientRects().length || !elem.getBoundingClientRect().width ) ? + swap( elem, cssShow, function() { + return getWidthOrHeight( elem, dimension, extra ); + } ) : + getWidthOrHeight( elem, dimension, extra ); + } + }, + + set: function( elem, value, extra ) { + var matches, + styles = getStyles( elem ), + + // Only read styles.position if the test has a chance to fail + // to avoid forcing a reflow. + scrollboxSizeBuggy = !support.scrollboxSize() && + styles.position === "absolute", + + // To avoid forcing a reflow, only fetch boxSizing if we need it (gh-3991) + boxSizingNeeded = scrollboxSizeBuggy || extra, + isBorderBox = boxSizingNeeded && + jQuery.css( elem, "boxSizing", false, styles ) === "border-box", + subtract = extra ? + boxModelAdjustment( + elem, + dimension, + extra, + isBorderBox, + styles + ) : + 0; + + // Account for unreliable border-box dimensions by comparing offset* to computed and + // faking a content-box to get border and padding (gh-3699) + if ( isBorderBox && scrollboxSizeBuggy ) { + subtract -= Math.ceil( + elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] - + parseFloat( styles[ dimension ] ) - + boxModelAdjustment( elem, dimension, "border", false, styles ) - + 0.5 + ); + } + + // Convert to pixels if value adjustment is needed + if ( subtract && ( matches = rcssNum.exec( value ) ) && + ( matches[ 3 ] || "px" ) !== "px" ) { + + elem.style[ dimension ] = value; + value = jQuery.css( elem, dimension ); + } + + return setPositiveNumber( elem, value, subtract ); + } + }; +} ); + +jQuery.cssHooks.marginLeft = addGetHookIf( support.reliableMarginLeft, + function( elem, computed ) { + if ( computed ) { + return ( parseFloat( curCSS( elem, "marginLeft" ) ) || + elem.getBoundingClientRect().left - + swap( elem, { marginLeft: 0 }, function() { + return elem.getBoundingClientRect().left; + } ) + ) + "px"; + } + } +); + +// These hooks are used by animate to expand properties +jQuery.each( { + margin: "", + padding: "", + border: "Width" +}, function( prefix, suffix ) { + jQuery.cssHooks[ prefix + suffix ] = { + expand: function( value ) { + var i = 0, + expanded = {}, + + // Assumes a single number if not a string + parts = typeof value === "string" ? value.split( " " ) : [ value ]; + + for ( ; i < 4; i++ ) { + expanded[ prefix + cssExpand[ i ] + suffix ] = + parts[ i ] || parts[ i - 2 ] || parts[ 0 ]; + } + + return expanded; + } + }; + + if ( prefix !== "margin" ) { + jQuery.cssHooks[ prefix + suffix ].set = setPositiveNumber; + } +} ); + +jQuery.fn.extend( { + css: function( name, value ) { + return access( this, function( elem, name, value ) { + var styles, len, + map = {}, + i = 0; + + if ( Array.isArray( name ) ) { + styles = getStyles( elem ); + len = name.length; + + for ( ; i < len; i++ ) { + map[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles ); + } + + return map; + } + + return value !== undefined ? + jQuery.style( elem, name, value ) : + jQuery.css( elem, name ); + }, name, value, arguments.length > 1 ); + } +} ); + + +function Tween( elem, options, prop, end, easing ) { + return new Tween.prototype.init( elem, options, prop, end, easing ); +} +jQuery.Tween = Tween; + +Tween.prototype = { + constructor: Tween, + init: function( elem, options, prop, end, easing, unit ) { + this.elem = elem; + this.prop = prop; + this.easing = easing || jQuery.easing._default; + this.options = options; + this.start = this.now = this.cur(); + this.end = end; + this.unit = unit || ( jQuery.cssNumber[ prop ] ? "" : "px" ); + }, + cur: function() { + var hooks = Tween.propHooks[ this.prop ]; + + return hooks && hooks.get ? + hooks.get( this ) : + Tween.propHooks._default.get( this ); + }, + run: function( percent ) { + var eased, + hooks = Tween.propHooks[ this.prop ]; + + if ( this.options.duration ) { + this.pos = eased = jQuery.easing[ this.easing ]( + percent, this.options.duration * percent, 0, 1, this.options.duration + ); + } else { + this.pos = eased = percent; + } + this.now = ( this.end - this.start ) * eased + this.start; + + if ( this.options.step ) { + this.options.step.call( this.elem, this.now, this ); + } + + if ( hooks && hooks.set ) { + hooks.set( this ); + } else { + Tween.propHooks._default.set( this ); + } + return this; + } +}; + +Tween.prototype.init.prototype = Tween.prototype; + +Tween.propHooks = { + _default: { + get: function( tween ) { + var result; + + // Use a property on the element directly when it is not a DOM element, + // or when there is no matching style property that exists. + if ( tween.elem.nodeType !== 1 || + tween.elem[ tween.prop ] != null && tween.elem.style[ tween.prop ] == null ) { + return tween.elem[ tween.prop ]; + } + + // Passing an empty string as a 3rd parameter to .css will automatically + // attempt a parseFloat and fallback to a string if the parse fails. + // Simple values such as "10px" are parsed to Float; + // complex values such as "rotate(1rad)" are returned as-is. + result = jQuery.css( tween.elem, tween.prop, "" ); + + // Empty strings, null, undefined and "auto" are converted to 0. + return !result || result === "auto" ? 0 : result; + }, + set: function( tween ) { + + // Use step hook for back compat. + // Use cssHook if its there. + // Use .style if available and use plain properties where available. + if ( jQuery.fx.step[ tween.prop ] ) { + jQuery.fx.step[ tween.prop ]( tween ); + } else if ( tween.elem.nodeType === 1 && ( + jQuery.cssHooks[ tween.prop ] || + tween.elem.style[ finalPropName( tween.prop ) ] != null ) ) { + jQuery.style( tween.elem, tween.prop, tween.now + tween.unit ); + } else { + tween.elem[ tween.prop ] = tween.now; + } + } + } +}; + +// Support: IE <=9 only +// Panic based approach to setting things on disconnected nodes +Tween.propHooks.scrollTop = Tween.propHooks.scrollLeft = { + set: function( tween ) { + if ( tween.elem.nodeType && tween.elem.parentNode ) { + tween.elem[ tween.prop ] = tween.now; + } + } +}; + +jQuery.easing = { + linear: function( p ) { + return p; + }, + swing: function( p ) { + return 0.5 - Math.cos( p * Math.PI ) / 2; + }, + _default: "swing" +}; + +jQuery.fx = Tween.prototype.init; + +// Back compat <1.8 extension point +jQuery.fx.step = {}; + + + + +var + fxNow, inProgress, + rfxtypes = /^(?:toggle|show|hide)$/, + rrun = /queueHooks$/; + +function schedule() { + if ( inProgress ) { + if ( document.hidden === false && window.requestAnimationFrame ) { + window.requestAnimationFrame( schedule ); + } else { + window.setTimeout( schedule, jQuery.fx.interval ); + } + + jQuery.fx.tick(); + } +} + +// Animations created synchronously will run synchronously +function createFxNow() { + window.setTimeout( function() { + fxNow = undefined; + } ); + return ( fxNow = Date.now() ); +} + +// Generate parameters to create a standard animation +function genFx( type, includeWidth ) { + var which, + i = 0, + attrs = { height: type }; + + // If we include width, step value is 1 to do all cssExpand values, + // otherwise step value is 2 to skip over Left and Right + includeWidth = includeWidth ? 1 : 0; + for ( ; i < 4; i += 2 - includeWidth ) { + which = cssExpand[ i ]; + attrs[ "margin" + which ] = attrs[ "padding" + which ] = type; + } + + if ( includeWidth ) { + attrs.opacity = attrs.width = type; + } + + return attrs; +} + +function createTween( value, prop, animation ) { + var tween, + collection = ( Animation.tweeners[ prop ] || [] ).concat( Animation.tweeners[ "*" ] ), + index = 0, + length = collection.length; + for ( ; index < length; index++ ) { + if ( ( tween = collection[ index ].call( animation, prop, value ) ) ) { + + // We're done with this property + return tween; + } + } +} + +function defaultPrefilter( elem, props, opts ) { + var prop, value, toggle, hooks, oldfire, propTween, restoreDisplay, display, + isBox = "width" in props || "height" in props, + anim = this, + orig = {}, + style = elem.style, + hidden = elem.nodeType && isHiddenWithinTree( elem ), + dataShow = dataPriv.get( elem, "fxshow" ); + + // Queue-skipping animations hijack the fx hooks + if ( !opts.queue ) { + hooks = jQuery._queueHooks( elem, "fx" ); + if ( hooks.unqueued == null ) { + hooks.unqueued = 0; + oldfire = hooks.empty.fire; + hooks.empty.fire = function() { + if ( !hooks.unqueued ) { + oldfire(); + } + }; + } + hooks.unqueued++; + + anim.always( function() { + + // Ensure the complete handler is called before this completes + anim.always( function() { + hooks.unqueued--; + if ( !jQuery.queue( elem, "fx" ).length ) { + hooks.empty.fire(); + } + } ); + } ); + } + + // Detect show/hide animations + for ( prop in props ) { + value = props[ prop ]; + if ( rfxtypes.test( value ) ) { + delete props[ prop ]; + toggle = toggle || value === "toggle"; + if ( value === ( hidden ? "hide" : "show" ) ) { + + // Pretend to be hidden if this is a "show" and + // there is still data from a stopped show/hide + if ( value === "show" && dataShow && dataShow[ prop ] !== undefined ) { + hidden = true; + + // Ignore all other no-op show/hide data + } else { + continue; + } + } + orig[ prop ] = dataShow && dataShow[ prop ] || jQuery.style( elem, prop ); + } + } + + // Bail out if this is a no-op like .hide().hide() + propTween = !jQuery.isEmptyObject( props ); + if ( !propTween && jQuery.isEmptyObject( orig ) ) { + return; + } + + // Restrict "overflow" and "display" styles during box animations + if ( isBox && elem.nodeType === 1 ) { + + // Support: IE <=9 - 11, Edge 12 - 15 + // Record all 3 overflow attributes because IE does not infer the shorthand + // from identically-valued overflowX and overflowY and Edge just mirrors + // the overflowX value there. + opts.overflow = [ style.overflow, style.overflowX, style.overflowY ]; + + // Identify a display type, preferring old show/hide data over the CSS cascade + restoreDisplay = dataShow && dataShow.display; + if ( restoreDisplay == null ) { + restoreDisplay = dataPriv.get( elem, "display" ); + } + display = jQuery.css( elem, "display" ); + if ( display === "none" ) { + if ( restoreDisplay ) { + display = restoreDisplay; + } else { + + // Get nonempty value(s) by temporarily forcing visibility + showHide( [ elem ], true ); + restoreDisplay = elem.style.display || restoreDisplay; + display = jQuery.css( elem, "display" ); + showHide( [ elem ] ); + } + } + + // Animate inline elements as inline-block + if ( display === "inline" || display === "inline-block" && restoreDisplay != null ) { + if ( jQuery.css( elem, "float" ) === "none" ) { + + // Restore the original display value at the end of pure show/hide animations + if ( !propTween ) { + anim.done( function() { + style.display = restoreDisplay; + } ); + if ( restoreDisplay == null ) { + display = style.display; + restoreDisplay = display === "none" ? "" : display; + } + } + style.display = "inline-block"; + } + } + } + + if ( opts.overflow ) { + style.overflow = "hidden"; + anim.always( function() { + style.overflow = opts.overflow[ 0 ]; + style.overflowX = opts.overflow[ 1 ]; + style.overflowY = opts.overflow[ 2 ]; + } ); + } + + // Implement show/hide animations + propTween = false; + for ( prop in orig ) { + + // General show/hide setup for this element animation + if ( !propTween ) { + if ( dataShow ) { + if ( "hidden" in dataShow ) { + hidden = dataShow.hidden; + } + } else { + dataShow = dataPriv.access( elem, "fxshow", { display: restoreDisplay } ); + } + + // Store hidden/visible for toggle so `.stop().toggle()` "reverses" + if ( toggle ) { + dataShow.hidden = !hidden; + } + + // Show elements before animating them + if ( hidden ) { + showHide( [ elem ], true ); + } + + /* eslint-disable no-loop-func */ + + anim.done( function() { + + /* eslint-enable no-loop-func */ + + // The final step of a "hide" animation is actually hiding the element + if ( !hidden ) { + showHide( [ elem ] ); + } + dataPriv.remove( elem, "fxshow" ); + for ( prop in orig ) { + jQuery.style( elem, prop, orig[ prop ] ); + } + } ); + } + + // Per-property setup + propTween = createTween( hidden ? dataShow[ prop ] : 0, prop, anim ); + if ( !( prop in dataShow ) ) { + dataShow[ prop ] = propTween.start; + if ( hidden ) { + propTween.end = propTween.start; + propTween.start = 0; + } + } + } +} + +function propFilter( props, specialEasing ) { + var index, name, easing, value, hooks; + + // camelCase, specialEasing and expand cssHook pass + for ( index in props ) { + name = camelCase( index ); + easing = specialEasing[ name ]; + value = props[ index ]; + if ( Array.isArray( value ) ) { + easing = value[ 1 ]; + value = props[ index ] = value[ 0 ]; + } + + if ( index !== name ) { + props[ name ] = value; + delete props[ index ]; + } + + hooks = jQuery.cssHooks[ name ]; + if ( hooks && "expand" in hooks ) { + value = hooks.expand( value ); + delete props[ name ]; + + // Not quite $.extend, this won't overwrite existing keys. + // Reusing 'index' because we have the correct "name" + for ( index in value ) { + if ( !( index in props ) ) { + props[ index ] = value[ index ]; + specialEasing[ index ] = easing; + } + } + } else { + specialEasing[ name ] = easing; + } + } +} + +function Animation( elem, properties, options ) { + var result, + stopped, + index = 0, + length = Animation.prefilters.length, + deferred = jQuery.Deferred().always( function() { + + // Don't match elem in the :animated selector + delete tick.elem; + } ), + tick = function() { + if ( stopped ) { + return false; + } + var currentTime = fxNow || createFxNow(), + remaining = Math.max( 0, animation.startTime + animation.duration - currentTime ), + + // Support: Android 2.3 only + // Archaic crash bug won't allow us to use `1 - ( 0.5 || 0 )` (#12497) + temp = remaining / animation.duration || 0, + percent = 1 - temp, + index = 0, + length = animation.tweens.length; + + for ( ; index < length; index++ ) { + animation.tweens[ index ].run( percent ); + } + + deferred.notifyWith( elem, [ animation, percent, remaining ] ); + + // If there's more to do, yield + if ( percent < 1 && length ) { + return remaining; + } + + // If this was an empty animation, synthesize a final progress notification + if ( !length ) { + deferred.notifyWith( elem, [ animation, 1, 0 ] ); + } + + // Resolve the animation and report its conclusion + deferred.resolveWith( elem, [ animation ] ); + return false; + }, + animation = deferred.promise( { + elem: elem, + props: jQuery.extend( {}, properties ), + opts: jQuery.extend( true, { + specialEasing: {}, + easing: jQuery.easing._default + }, options ), + originalProperties: properties, + originalOptions: options, + startTime: fxNow || createFxNow(), + duration: options.duration, + tweens: [], + createTween: function( prop, end ) { + var tween = jQuery.Tween( elem, animation.opts, prop, end, + animation.opts.specialEasing[ prop ] || animation.opts.easing ); + animation.tweens.push( tween ); + return tween; + }, + stop: function( gotoEnd ) { + var index = 0, + + // If we are going to the end, we want to run all the tweens + // otherwise we skip this part + length = gotoEnd ? animation.tweens.length : 0; + if ( stopped ) { + return this; + } + stopped = true; + for ( ; index < length; index++ ) { + animation.tweens[ index ].run( 1 ); + } + + // Resolve when we played the last frame; otherwise, reject + if ( gotoEnd ) { + deferred.notifyWith( elem, [ animation, 1, 0 ] ); + deferred.resolveWith( elem, [ animation, gotoEnd ] ); + } else { + deferred.rejectWith( elem, [ animation, gotoEnd ] ); + } + return this; + } + } ), + props = animation.props; + + propFilter( props, animation.opts.specialEasing ); + + for ( ; index < length; index++ ) { + result = Animation.prefilters[ index ].call( animation, elem, props, animation.opts ); + if ( result ) { + if ( isFunction( result.stop ) ) { + jQuery._queueHooks( animation.elem, animation.opts.queue ).stop = + result.stop.bind( result ); + } + return result; + } + } + + jQuery.map( props, createTween, animation ); + + if ( isFunction( animation.opts.start ) ) { + animation.opts.start.call( elem, animation ); + } + + // Attach callbacks from options + animation + .progress( animation.opts.progress ) + .done( animation.opts.done, animation.opts.complete ) + .fail( animation.opts.fail ) + .always( animation.opts.always ); + + jQuery.fx.timer( + jQuery.extend( tick, { + elem: elem, + anim: animation, + queue: animation.opts.queue + } ) + ); + + return animation; +} + +jQuery.Animation = jQuery.extend( Animation, { + + tweeners: { + "*": [ function( prop, value ) { + var tween = this.createTween( prop, value ); + adjustCSS( tween.elem, prop, rcssNum.exec( value ), tween ); + return tween; + } ] + }, + + tweener: function( props, callback ) { + if ( isFunction( props ) ) { + callback = props; + props = [ "*" ]; + } else { + props = props.match( rnothtmlwhite ); + } + + var prop, + index = 0, + length = props.length; + + for ( ; index < length; index++ ) { + prop = props[ index ]; + Animation.tweeners[ prop ] = Animation.tweeners[ prop ] || []; + Animation.tweeners[ prop ].unshift( callback ); + } + }, + + prefilters: [ defaultPrefilter ], + + prefilter: function( callback, prepend ) { + if ( prepend ) { + Animation.prefilters.unshift( callback ); + } else { + Animation.prefilters.push( callback ); + } + } +} ); + +jQuery.speed = function( speed, easing, fn ) { + var opt = speed && typeof speed === "object" ? jQuery.extend( {}, speed ) : { + complete: fn || !fn && easing || + isFunction( speed ) && speed, + duration: speed, + easing: fn && easing || easing && !isFunction( easing ) && easing + }; + + // Go to the end state if fx are off + if ( jQuery.fx.off ) { + opt.duration = 0; + + } else { + if ( typeof opt.duration !== "number" ) { + if ( opt.duration in jQuery.fx.speeds ) { + opt.duration = jQuery.fx.speeds[ opt.duration ]; + + } else { + opt.duration = jQuery.fx.speeds._default; + } + } + } + + // Normalize opt.queue - true/undefined/null -> "fx" + if ( opt.queue == null || opt.queue === true ) { + opt.queue = "fx"; + } + + // Queueing + opt.old = opt.complete; + + opt.complete = function() { + if ( isFunction( opt.old ) ) { + opt.old.call( this ); + } + + if ( opt.queue ) { + jQuery.dequeue( this, opt.queue ); + } + }; + + return opt; +}; + +jQuery.fn.extend( { + fadeTo: function( speed, to, easing, callback ) { + + // Show any hidden elements after setting opacity to 0 + return this.filter( isHiddenWithinTree ).css( "opacity", 0 ).show() + + // Animate to the value specified + .end().animate( { opacity: to }, speed, easing, callback ); + }, + animate: function( prop, speed, easing, callback ) { + var empty = jQuery.isEmptyObject( prop ), + optall = jQuery.speed( speed, easing, callback ), + doAnimation = function() { + + // Operate on a copy of prop so per-property easing won't be lost + var anim = Animation( this, jQuery.extend( {}, prop ), optall ); + + // Empty animations, or finishing resolves immediately + if ( empty || dataPriv.get( this, "finish" ) ) { + anim.stop( true ); + } + }; + doAnimation.finish = doAnimation; + + return empty || optall.queue === false ? + this.each( doAnimation ) : + this.queue( optall.queue, doAnimation ); + }, + stop: function( type, clearQueue, gotoEnd ) { + var stopQueue = function( hooks ) { + var stop = hooks.stop; + delete hooks.stop; + stop( gotoEnd ); + }; + + if ( typeof type !== "string" ) { + gotoEnd = clearQueue; + clearQueue = type; + type = undefined; + } + if ( clearQueue ) { + this.queue( type || "fx", [] ); + } + + return this.each( function() { + var dequeue = true, + index = type != null && type + "queueHooks", + timers = jQuery.timers, + data = dataPriv.get( this ); + + if ( index ) { + if ( data[ index ] && data[ index ].stop ) { + stopQueue( data[ index ] ); + } + } else { + for ( index in data ) { + if ( data[ index ] && data[ index ].stop && rrun.test( index ) ) { + stopQueue( data[ index ] ); + } + } + } + + for ( index = timers.length; index--; ) { + if ( timers[ index ].elem === this && + ( type == null || timers[ index ].queue === type ) ) { + + timers[ index ].anim.stop( gotoEnd ); + dequeue = false; + timers.splice( index, 1 ); + } + } + + // Start the next in the queue if the last step wasn't forced. + // Timers currently will call their complete callbacks, which + // will dequeue but only if they were gotoEnd. + if ( dequeue || !gotoEnd ) { + jQuery.dequeue( this, type ); + } + } ); + }, + finish: function( type ) { + if ( type !== false ) { + type = type || "fx"; + } + return this.each( function() { + var index, + data = dataPriv.get( this ), + queue = data[ type + "queue" ], + hooks = data[ type + "queueHooks" ], + timers = jQuery.timers, + length = queue ? queue.length : 0; + + // Enable finishing flag on private data + data.finish = true; + + // Empty the queue first + jQuery.queue( this, type, [] ); + + if ( hooks && hooks.stop ) { + hooks.stop.call( this, true ); + } + + // Look for any active animations, and finish them + for ( index = timers.length; index--; ) { + if ( timers[ index ].elem === this && timers[ index ].queue === type ) { + timers[ index ].anim.stop( true ); + timers.splice( index, 1 ); + } + } + + // Look for any animations in the old queue and finish them + for ( index = 0; index < length; index++ ) { + if ( queue[ index ] && queue[ index ].finish ) { + queue[ index ].finish.call( this ); + } + } + + // Turn off finishing flag + delete data.finish; + } ); + } +} ); + +jQuery.each( [ "toggle", "show", "hide" ], function( _i, name ) { + var cssFn = jQuery.fn[ name ]; + jQuery.fn[ name ] = function( speed, easing, callback ) { + return speed == null || typeof speed === "boolean" ? + cssFn.apply( this, arguments ) : + this.animate( genFx( name, true ), speed, easing, callback ); + }; +} ); + +// Generate shortcuts for custom animations +jQuery.each( { + slideDown: genFx( "show" ), + slideUp: genFx( "hide" ), + slideToggle: genFx( "toggle" ), + fadeIn: { opacity: "show" }, + fadeOut: { opacity: "hide" }, + fadeToggle: { opacity: "toggle" } +}, function( name, props ) { + jQuery.fn[ name ] = function( speed, easing, callback ) { + return this.animate( props, speed, easing, callback ); + }; +} ); + +jQuery.timers = []; +jQuery.fx.tick = function() { + var timer, + i = 0, + timers = jQuery.timers; + + fxNow = Date.now(); + + for ( ; i < timers.length; i++ ) { + timer = timers[ i ]; + + // Run the timer and safely remove it when done (allowing for external removal) + if ( !timer() && timers[ i ] === timer ) { + timers.splice( i--, 1 ); + } + } + + if ( !timers.length ) { + jQuery.fx.stop(); + } + fxNow = undefined; +}; + +jQuery.fx.timer = function( timer ) { + jQuery.timers.push( timer ); + jQuery.fx.start(); +}; + +jQuery.fx.interval = 13; +jQuery.fx.start = function() { + if ( inProgress ) { + return; + } + + inProgress = true; + schedule(); +}; + +jQuery.fx.stop = function() { + inProgress = null; +}; + +jQuery.fx.speeds = { + slow: 600, + fast: 200, + + // Default speed + _default: 400 +}; + + +// Based off of the plugin by Clint Helfers, with permission. +// https://web.archive.org/web/20100324014747/http://blindsignals.com/index.php/2009/07/jquery-delay/ +jQuery.fn.delay = function( time, type ) { + time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time; + type = type || "fx"; + + return this.queue( type, function( next, hooks ) { + var timeout = window.setTimeout( next, time ); + hooks.stop = function() { + window.clearTimeout( timeout ); + }; + } ); +}; + + +( function() { + var input = document.createElement( "input" ), + select = document.createElement( "select" ), + opt = select.appendChild( document.createElement( "option" ) ); + + input.type = "checkbox"; + + // Support: Android <=4.3 only + // Default value for a checkbox should be "on" + support.checkOn = input.value !== ""; + + // Support: IE <=11 only + // Must access selectedIndex to make default options select + support.optSelected = opt.selected; + + // Support: IE <=11 only + // An input loses its value after becoming a radio + input = document.createElement( "input" ); + input.value = "t"; + input.type = "radio"; + support.radioValue = input.value === "t"; +} )(); + + +var boolHook, + attrHandle = jQuery.expr.attrHandle; + +jQuery.fn.extend( { + attr: function( name, value ) { + return access( this, jQuery.attr, name, value, arguments.length > 1 ); + }, + + removeAttr: function( name ) { + return this.each( function() { + jQuery.removeAttr( this, name ); + } ); + } +} ); + +jQuery.extend( { + attr: function( elem, name, value ) { + var ret, hooks, + nType = elem.nodeType; + + // Don't get/set attributes on text, comment and attribute nodes + if ( nType === 3 || nType === 8 || nType === 2 ) { + return; + } + + // Fallback to prop when attributes are not supported + if ( typeof elem.getAttribute === "undefined" ) { + return jQuery.prop( elem, name, value ); + } + + // Attribute hooks are determined by the lowercase version + // Grab necessary hook if one is defined + if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) { + hooks = jQuery.attrHooks[ name.toLowerCase() ] || + ( jQuery.expr.match.bool.test( name ) ? boolHook : undefined ); + } + + if ( value !== undefined ) { + if ( value === null ) { + jQuery.removeAttr( elem, name ); + return; + } + + if ( hooks && "set" in hooks && + ( ret = hooks.set( elem, value, name ) ) !== undefined ) { + return ret; + } + + elem.setAttribute( name, value + "" ); + return value; + } + + if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) { + return ret; + } + + ret = jQuery.find.attr( elem, name ); + + // Non-existent attributes return null, we normalize to undefined + return ret == null ? undefined : ret; + }, + + attrHooks: { + type: { + set: function( elem, value ) { + if ( !support.radioValue && value === "radio" && + nodeName( elem, "input" ) ) { + var val = elem.value; + elem.setAttribute( "type", value ); + if ( val ) { + elem.value = val; + } + return value; + } + } + } + }, + + removeAttr: function( elem, value ) { + var name, + i = 0, + + // Attribute names can contain non-HTML whitespace characters + // https://html.spec.whatwg.org/multipage/syntax.html#attributes-2 + attrNames = value && value.match( rnothtmlwhite ); + + if ( attrNames && elem.nodeType === 1 ) { + while ( ( name = attrNames[ i++ ] ) ) { + elem.removeAttribute( name ); + } + } + } +} ); + +// Hooks for boolean attributes +boolHook = { + set: function( elem, value, name ) { + if ( value === false ) { + + // Remove boolean attributes when set to false + jQuery.removeAttr( elem, name ); + } else { + elem.setAttribute( name, name ); + } + return name; + } +}; + +jQuery.each( jQuery.expr.match.bool.source.match( /\w+/g ), function( _i, name ) { + var getter = attrHandle[ name ] || jQuery.find.attr; + + attrHandle[ name ] = function( elem, name, isXML ) { + var ret, handle, + lowercaseName = name.toLowerCase(); + + if ( !isXML ) { + + // Avoid an infinite loop by temporarily removing this function from the getter + handle = attrHandle[ lowercaseName ]; + attrHandle[ lowercaseName ] = ret; + ret = getter( elem, name, isXML ) != null ? + lowercaseName : + null; + attrHandle[ lowercaseName ] = handle; + } + return ret; + }; +} ); + + + + +var rfocusable = /^(?:input|select|textarea|button)$/i, + rclickable = /^(?:a|area)$/i; + +jQuery.fn.extend( { + prop: function( name, value ) { + return access( this, jQuery.prop, name, value, arguments.length > 1 ); + }, + + removeProp: function( name ) { + return this.each( function() { + delete this[ jQuery.propFix[ name ] || name ]; + } ); + } +} ); + +jQuery.extend( { + prop: function( elem, name, value ) { + var ret, hooks, + nType = elem.nodeType; + + // Don't get/set properties on text, comment and attribute nodes + if ( nType === 3 || nType === 8 || nType === 2 ) { + return; + } + + if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) { + + // Fix name and attach hooks + name = jQuery.propFix[ name ] || name; + hooks = jQuery.propHooks[ name ]; + } + + if ( value !== undefined ) { + if ( hooks && "set" in hooks && + ( ret = hooks.set( elem, value, name ) ) !== undefined ) { + return ret; + } + + return ( elem[ name ] = value ); + } + + if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) { + return ret; + } + + return elem[ name ]; + }, + + propHooks: { + tabIndex: { + get: function( elem ) { + + // Support: IE <=9 - 11 only + // elem.tabIndex doesn't always return the + // correct value when it hasn't been explicitly set + // https://web.archive.org/web/20141116233347/http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/ + // Use proper attribute retrieval(#12072) + var tabindex = jQuery.find.attr( elem, "tabindex" ); + + if ( tabindex ) { + return parseInt( tabindex, 10 ); + } + + if ( + rfocusable.test( elem.nodeName ) || + rclickable.test( elem.nodeName ) && + elem.href + ) { + return 0; + } + + return -1; + } + } + }, + + propFix: { + "for": "htmlFor", + "class": "className" + } +} ); + +// Support: IE <=11 only +// Accessing the selectedIndex property +// forces the browser to respect setting selected +// on the option +// The getter ensures a default option is selected +// when in an optgroup +// eslint rule "no-unused-expressions" is disabled for this code +// since it considers such accessions noop +if ( !support.optSelected ) { + jQuery.propHooks.selected = { + get: function( elem ) { + + /* eslint no-unused-expressions: "off" */ + + var parent = elem.parentNode; + if ( parent && parent.parentNode ) { + parent.parentNode.selectedIndex; + } + return null; + }, + set: function( elem ) { + + /* eslint no-unused-expressions: "off" */ + + var parent = elem.parentNode; + if ( parent ) { + parent.selectedIndex; + + if ( parent.parentNode ) { + parent.parentNode.selectedIndex; + } + } + } + }; +} + +jQuery.each( [ + "tabIndex", + "readOnly", + "maxLength", + "cellSpacing", + "cellPadding", + "rowSpan", + "colSpan", + "useMap", + "frameBorder", + "contentEditable" +], function() { + jQuery.propFix[ this.toLowerCase() ] = this; +} ); + + + + + // Strip and collapse whitespace according to HTML spec + // https://infra.spec.whatwg.org/#strip-and-collapse-ascii-whitespace + function stripAndCollapse( value ) { + var tokens = value.match( rnothtmlwhite ) || []; + return tokens.join( " " ); + } + + +function getClass( elem ) { + return elem.getAttribute && elem.getAttribute( "class" ) || ""; +} + +function classesToArray( value ) { + if ( Array.isArray( value ) ) { + return value; + } + if ( typeof value === "string" ) { + return value.match( rnothtmlwhite ) || []; + } + return []; +} + +jQuery.fn.extend( { + addClass: function( value ) { + var classes, elem, cur, curValue, clazz, j, finalValue, + i = 0; + + if ( isFunction( value ) ) { + return this.each( function( j ) { + jQuery( this ).addClass( value.call( this, j, getClass( this ) ) ); + } ); + } + + classes = classesToArray( value ); + + if ( classes.length ) { + while ( ( elem = this[ i++ ] ) ) { + curValue = getClass( elem ); + cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " ); + + if ( cur ) { + j = 0; + while ( ( clazz = classes[ j++ ] ) ) { + if ( cur.indexOf( " " + clazz + " " ) < 0 ) { + cur += clazz + " "; + } + } + + // Only assign if different to avoid unneeded rendering. + finalValue = stripAndCollapse( cur ); + if ( curValue !== finalValue ) { + elem.setAttribute( "class", finalValue ); + } + } + } + } + + return this; + }, + + removeClass: function( value ) { + var classes, elem, cur, curValue, clazz, j, finalValue, + i = 0; + + if ( isFunction( value ) ) { + return this.each( function( j ) { + jQuery( this ).removeClass( value.call( this, j, getClass( this ) ) ); + } ); + } + + if ( !arguments.length ) { + return this.attr( "class", "" ); + } + + classes = classesToArray( value ); + + if ( classes.length ) { + while ( ( elem = this[ i++ ] ) ) { + curValue = getClass( elem ); + + // This expression is here for better compressibility (see addClass) + cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " ); + + if ( cur ) { + j = 0; + while ( ( clazz = classes[ j++ ] ) ) { + + // Remove *all* instances + while ( cur.indexOf( " " + clazz + " " ) > -1 ) { + cur = cur.replace( " " + clazz + " ", " " ); + } + } + + // Only assign if different to avoid unneeded rendering. + finalValue = stripAndCollapse( cur ); + if ( curValue !== finalValue ) { + elem.setAttribute( "class", finalValue ); + } + } + } + } + + return this; + }, + + toggleClass: function( value, stateVal ) { + var type = typeof value, + isValidValue = type === "string" || Array.isArray( value ); + + if ( typeof stateVal === "boolean" && isValidValue ) { + return stateVal ? this.addClass( value ) : this.removeClass( value ); + } + + if ( isFunction( value ) ) { + return this.each( function( i ) { + jQuery( this ).toggleClass( + value.call( this, i, getClass( this ), stateVal ), + stateVal + ); + } ); + } + + return this.each( function() { + var className, i, self, classNames; + + if ( isValidValue ) { + + // Toggle individual class names + i = 0; + self = jQuery( this ); + classNames = classesToArray( value ); + + while ( ( className = classNames[ i++ ] ) ) { + + // Check each className given, space separated list + if ( self.hasClass( className ) ) { + self.removeClass( className ); + } else { + self.addClass( className ); + } + } + + // Toggle whole class name + } else if ( value === undefined || type === "boolean" ) { + className = getClass( this ); + if ( className ) { + + // Store className if set + dataPriv.set( this, "__className__", className ); + } + + // If the element has a class name or if we're passed `false`, + // then remove the whole classname (if there was one, the above saved it). + // Otherwise bring back whatever was previously saved (if anything), + // falling back to the empty string if nothing was stored. + if ( this.setAttribute ) { + this.setAttribute( "class", + className || value === false ? + "" : + dataPriv.get( this, "__className__" ) || "" + ); + } + } + } ); + }, + + hasClass: function( selector ) { + var className, elem, + i = 0; + + className = " " + selector + " "; + while ( ( elem = this[ i++ ] ) ) { + if ( elem.nodeType === 1 && + ( " " + stripAndCollapse( getClass( elem ) ) + " " ).indexOf( className ) > -1 ) { + return true; + } + } + + return false; + } +} ); + + + + +var rreturn = /\r/g; + +jQuery.fn.extend( { + val: function( value ) { + var hooks, ret, valueIsFunction, + elem = this[ 0 ]; + + if ( !arguments.length ) { + if ( elem ) { + hooks = jQuery.valHooks[ elem.type ] || + jQuery.valHooks[ elem.nodeName.toLowerCase() ]; + + if ( hooks && + "get" in hooks && + ( ret = hooks.get( elem, "value" ) ) !== undefined + ) { + return ret; + } + + ret = elem.value; + + // Handle most common string cases + if ( typeof ret === "string" ) { + return ret.replace( rreturn, "" ); + } + + // Handle cases where value is null/undef or number + return ret == null ? "" : ret; + } + + return; + } + + valueIsFunction = isFunction( value ); + + return this.each( function( i ) { + var val; + + if ( this.nodeType !== 1 ) { + return; + } + + if ( valueIsFunction ) { + val = value.call( this, i, jQuery( this ).val() ); + } else { + val = value; + } + + // Treat null/undefined as ""; convert numbers to string + if ( val == null ) { + val = ""; + + } else if ( typeof val === "number" ) { + val += ""; + + } else if ( Array.isArray( val ) ) { + val = jQuery.map( val, function( value ) { + return value == null ? "" : value + ""; + } ); + } + + hooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ]; + + // If set returns undefined, fall back to normal setting + if ( !hooks || !( "set" in hooks ) || hooks.set( this, val, "value" ) === undefined ) { + this.value = val; + } + } ); + } +} ); + +jQuery.extend( { + valHooks: { + option: { + get: function( elem ) { + + var val = jQuery.find.attr( elem, "value" ); + return val != null ? + val : + + // Support: IE <=10 - 11 only + // option.text throws exceptions (#14686, #14858) + // Strip and collapse whitespace + // https://html.spec.whatwg.org/#strip-and-collapse-whitespace + stripAndCollapse( jQuery.text( elem ) ); + } + }, + select: { + get: function( elem ) { + var value, option, i, + options = elem.options, + index = elem.selectedIndex, + one = elem.type === "select-one", + values = one ? null : [], + max = one ? index + 1 : options.length; + + if ( index < 0 ) { + i = max; + + } else { + i = one ? index : 0; + } + + // Loop through all the selected options + for ( ; i < max; i++ ) { + option = options[ i ]; + + // Support: IE <=9 only + // IE8-9 doesn't update selected after form reset (#2551) + if ( ( option.selected || i === index ) && + + // Don't return options that are disabled or in a disabled optgroup + !option.disabled && + ( !option.parentNode.disabled || + !nodeName( option.parentNode, "optgroup" ) ) ) { + + // Get the specific value for the option + value = jQuery( option ).val(); + + // We don't need an array for one selects + if ( one ) { + return value; + } + + // Multi-Selects return an array + values.push( value ); + } + } + + return values; + }, + + set: function( elem, value ) { + var optionSet, option, + options = elem.options, + values = jQuery.makeArray( value ), + i = options.length; + + while ( i-- ) { + option = options[ i ]; + + /* eslint-disable no-cond-assign */ + + if ( option.selected = + jQuery.inArray( jQuery.valHooks.option.get( option ), values ) > -1 + ) { + optionSet = true; + } + + /* eslint-enable no-cond-assign */ + } + + // Force browsers to behave consistently when non-matching value is set + if ( !optionSet ) { + elem.selectedIndex = -1; + } + return values; + } + } + } +} ); + +// Radios and checkboxes getter/setter +jQuery.each( [ "radio", "checkbox" ], function() { + jQuery.valHooks[ this ] = { + set: function( elem, value ) { + if ( Array.isArray( value ) ) { + return ( elem.checked = jQuery.inArray( jQuery( elem ).val(), value ) > -1 ); + } + } + }; + if ( !support.checkOn ) { + jQuery.valHooks[ this ].get = function( elem ) { + return elem.getAttribute( "value" ) === null ? "on" : elem.value; + }; + } +} ); + + + + +// Return jQuery for attributes-only inclusion + + +support.focusin = "onfocusin" in window; + + +var rfocusMorph = /^(?:focusinfocus|focusoutblur)$/, + stopPropagationCallback = function( e ) { + e.stopPropagation(); + }; + +jQuery.extend( jQuery.event, { + + trigger: function( event, data, elem, onlyHandlers ) { + + var i, cur, tmp, bubbleType, ontype, handle, special, lastElement, + eventPath = [ elem || document ], + type = hasOwn.call( event, "type" ) ? event.type : event, + namespaces = hasOwn.call( event, "namespace" ) ? event.namespace.split( "." ) : []; + + cur = lastElement = tmp = elem = elem || document; + + // Don't do events on text and comment nodes + if ( elem.nodeType === 3 || elem.nodeType === 8 ) { + return; + } + + // focus/blur morphs to focusin/out; ensure we're not firing them right now + if ( rfocusMorph.test( type + jQuery.event.triggered ) ) { + return; + } + + if ( type.indexOf( "." ) > -1 ) { + + // Namespaced trigger; create a regexp to match event type in handle() + namespaces = type.split( "." ); + type = namespaces.shift(); + namespaces.sort(); + } + ontype = type.indexOf( ":" ) < 0 && "on" + type; + + // Caller can pass in a jQuery.Event object, Object, or just an event type string + event = event[ jQuery.expando ] ? + event : + new jQuery.Event( type, typeof event === "object" && event ); + + // Trigger bitmask: & 1 for native handlers; & 2 for jQuery (always true) + event.isTrigger = onlyHandlers ? 2 : 3; + event.namespace = namespaces.join( "." ); + event.rnamespace = event.namespace ? + new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" ) : + null; + + // Clean up the event in case it is being reused + event.result = undefined; + if ( !event.target ) { + event.target = elem; + } + + // Clone any incoming data and prepend the event, creating the handler arg list + data = data == null ? + [ event ] : + jQuery.makeArray( data, [ event ] ); + + // Allow special events to draw outside the lines + special = jQuery.event.special[ type ] || {}; + if ( !onlyHandlers && special.trigger && special.trigger.apply( elem, data ) === false ) { + return; + } + + // Determine event propagation path in advance, per W3C events spec (#9951) + // Bubble up to document, then to window; watch for a global ownerDocument var (#9724) + if ( !onlyHandlers && !special.noBubble && !isWindow( elem ) ) { + + bubbleType = special.delegateType || type; + if ( !rfocusMorph.test( bubbleType + type ) ) { + cur = cur.parentNode; + } + for ( ; cur; cur = cur.parentNode ) { + eventPath.push( cur ); + tmp = cur; + } + + // Only add window if we got to document (e.g., not plain obj or detached DOM) + if ( tmp === ( elem.ownerDocument || document ) ) { + eventPath.push( tmp.defaultView || tmp.parentWindow || window ); + } + } + + // Fire handlers on the event path + i = 0; + while ( ( cur = eventPath[ i++ ] ) && !event.isPropagationStopped() ) { + lastElement = cur; + event.type = i > 1 ? + bubbleType : + special.bindType || type; + + // jQuery handler + handle = ( + dataPriv.get( cur, "events" ) || Object.create( null ) + )[ event.type ] && + dataPriv.get( cur, "handle" ); + if ( handle ) { + handle.apply( cur, data ); + } + + // Native handler + handle = ontype && cur[ ontype ]; + if ( handle && handle.apply && acceptData( cur ) ) { + event.result = handle.apply( cur, data ); + if ( event.result === false ) { + event.preventDefault(); + } + } + } + event.type = type; + + // If nobody prevented the default action, do it now + if ( !onlyHandlers && !event.isDefaultPrevented() ) { + + if ( ( !special._default || + special._default.apply( eventPath.pop(), data ) === false ) && + acceptData( elem ) ) { + + // Call a native DOM method on the target with the same name as the event. + // Don't do default actions on window, that's where global variables be (#6170) + if ( ontype && isFunction( elem[ type ] ) && !isWindow( elem ) ) { + + // Don't re-trigger an onFOO event when we call its FOO() method + tmp = elem[ ontype ]; + + if ( tmp ) { + elem[ ontype ] = null; + } + + // Prevent re-triggering of the same event, since we already bubbled it above + jQuery.event.triggered = type; + + if ( event.isPropagationStopped() ) { + lastElement.addEventListener( type, stopPropagationCallback ); + } + + elem[ type ](); + + if ( event.isPropagationStopped() ) { + lastElement.removeEventListener( type, stopPropagationCallback ); + } + + jQuery.event.triggered = undefined; + + if ( tmp ) { + elem[ ontype ] = tmp; + } + } + } + } + + return event.result; + }, + + // Piggyback on a donor event to simulate a different one + // Used only for `focus(in | out)` events + simulate: function( type, elem, event ) { + var e = jQuery.extend( + new jQuery.Event(), + event, + { + type: type, + isSimulated: true + } + ); + + jQuery.event.trigger( e, null, elem ); + } + +} ); + +jQuery.fn.extend( { + + trigger: function( type, data ) { + return this.each( function() { + jQuery.event.trigger( type, data, this ); + } ); + }, + triggerHandler: function( type, data ) { + var elem = this[ 0 ]; + if ( elem ) { + return jQuery.event.trigger( type, data, elem, true ); + } + } +} ); + + +// Support: Firefox <=44 +// Firefox doesn't have focus(in | out) events +// Related ticket - https://bugzilla.mozilla.org/show_bug.cgi?id=687787 +// +// Support: Chrome <=48 - 49, Safari <=9.0 - 9.1 +// focus(in | out) events fire after focus & blur events, +// which is spec violation - http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order +// Related ticket - https://bugs.chromium.org/p/chromium/issues/detail?id=449857 +if ( !support.focusin ) { + jQuery.each( { focus: "focusin", blur: "focusout" }, function( orig, fix ) { + + // Attach a single capturing handler on the document while someone wants focusin/focusout + var handler = function( event ) { + jQuery.event.simulate( fix, event.target, jQuery.event.fix( event ) ); + }; + + jQuery.event.special[ fix ] = { + setup: function() { + + // Handle: regular nodes (via `this.ownerDocument`), window + // (via `this.document`) & document (via `this`). + var doc = this.ownerDocument || this.document || this, + attaches = dataPriv.access( doc, fix ); + + if ( !attaches ) { + doc.addEventListener( orig, handler, true ); + } + dataPriv.access( doc, fix, ( attaches || 0 ) + 1 ); + }, + teardown: function() { + var doc = this.ownerDocument || this.document || this, + attaches = dataPriv.access( doc, fix ) - 1; + + if ( !attaches ) { + doc.removeEventListener( orig, handler, true ); + dataPriv.remove( doc, fix ); + + } else { + dataPriv.access( doc, fix, attaches ); + } + } + }; + } ); +} +var location = window.location; + +var nonce = { guid: Date.now() }; + +var rquery = ( /\?/ ); + + + +// Cross-browser xml parsing +jQuery.parseXML = function( data ) { + var xml; + if ( !data || typeof data !== "string" ) { + return null; + } + + // Support: IE 9 - 11 only + // IE throws on parseFromString with invalid input. + try { + xml = ( new window.DOMParser() ).parseFromString( data, "text/xml" ); + } catch ( e ) { + xml = undefined; + } + + if ( !xml || xml.getElementsByTagName( "parsererror" ).length ) { + jQuery.error( "Invalid XML: " + data ); + } + return xml; +}; + + +var + rbracket = /\[\]$/, + rCRLF = /\r?\n/g, + rsubmitterTypes = /^(?:submit|button|image|reset|file)$/i, + rsubmittable = /^(?:input|select|textarea|keygen)/i; + +function buildParams( prefix, obj, traditional, add ) { + var name; + + if ( Array.isArray( obj ) ) { + + // Serialize array item. + jQuery.each( obj, function( i, v ) { + if ( traditional || rbracket.test( prefix ) ) { + + // Treat each array item as a scalar. + add( prefix, v ); + + } else { + + // Item is non-scalar (array or object), encode its numeric index. + buildParams( + prefix + "[" + ( typeof v === "object" && v != null ? i : "" ) + "]", + v, + traditional, + add + ); + } + } ); + + } else if ( !traditional && toType( obj ) === "object" ) { + + // Serialize object item. + for ( name in obj ) { + buildParams( prefix + "[" + name + "]", obj[ name ], traditional, add ); + } + + } else { + + // Serialize scalar item. + add( prefix, obj ); + } +} + +// Serialize an array of form elements or a set of +// key/values into a query string +jQuery.param = function( a, traditional ) { + var prefix, + s = [], + add = function( key, valueOrFunction ) { + + // If value is a function, invoke it and use its return value + var value = isFunction( valueOrFunction ) ? + valueOrFunction() : + valueOrFunction; + + s[ s.length ] = encodeURIComponent( key ) + "=" + + encodeURIComponent( value == null ? "" : value ); + }; + + if ( a == null ) { + return ""; + } + + // If an array was passed in, assume that it is an array of form elements. + if ( Array.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) { + + // Serialize the form elements + jQuery.each( a, function() { + add( this.name, this.value ); + } ); + + } else { + + // If traditional, encode the "old" way (the way 1.3.2 or older + // did it), otherwise encode params recursively. + for ( prefix in a ) { + buildParams( prefix, a[ prefix ], traditional, add ); + } + } + + // Return the resulting serialization + return s.join( "&" ); +}; + +jQuery.fn.extend( { + serialize: function() { + return jQuery.param( this.serializeArray() ); + }, + serializeArray: function() { + return this.map( function() { + + // Can add propHook for "elements" to filter or add form elements + var elements = jQuery.prop( this, "elements" ); + return elements ? jQuery.makeArray( elements ) : this; + } ) + .filter( function() { + var type = this.type; + + // Use .is( ":disabled" ) so that fieldset[disabled] works + return this.name && !jQuery( this ).is( ":disabled" ) && + rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) && + ( this.checked || !rcheckableType.test( type ) ); + } ) + .map( function( _i, elem ) { + var val = jQuery( this ).val(); + + if ( val == null ) { + return null; + } + + if ( Array.isArray( val ) ) { + return jQuery.map( val, function( val ) { + return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) }; + } ); + } + + return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) }; + } ).get(); + } +} ); + + +var + r20 = /%20/g, + rhash = /#.*$/, + rantiCache = /([?&])_=[^&]*/, + rheaders = /^(.*?):[ \t]*([^\r\n]*)$/mg, + + // #7653, #8125, #8152: local protocol detection + rlocalProtocol = /^(?:about|app|app-storage|.+-extension|file|res|widget):$/, + rnoContent = /^(?:GET|HEAD)$/, + rprotocol = /^\/\//, + + /* Prefilters + * 1) They are useful to introduce custom dataTypes (see ajax/jsonp.js for an example) + * 2) These are called: + * - BEFORE asking for a transport + * - AFTER param serialization (s.data is a string if s.processData is true) + * 3) key is the dataType + * 4) the catchall symbol "*" can be used + * 5) execution will start with transport dataType and THEN continue down to "*" if needed + */ + prefilters = {}, + + /* Transports bindings + * 1) key is the dataType + * 2) the catchall symbol "*" can be used + * 3) selection will start with transport dataType and THEN go to "*" if needed + */ + transports = {}, + + // Avoid comment-prolog char sequence (#10098); must appease lint and evade compression + allTypes = "*/".concat( "*" ), + + // Anchor tag for parsing the document origin + originAnchor = document.createElement( "a" ); + originAnchor.href = location.href; + +// Base "constructor" for jQuery.ajaxPrefilter and jQuery.ajaxTransport +function addToPrefiltersOrTransports( structure ) { + + // dataTypeExpression is optional and defaults to "*" + return function( dataTypeExpression, func ) { + + if ( typeof dataTypeExpression !== "string" ) { + func = dataTypeExpression; + dataTypeExpression = "*"; + } + + var dataType, + i = 0, + dataTypes = dataTypeExpression.toLowerCase().match( rnothtmlwhite ) || []; + + if ( isFunction( func ) ) { + + // For each dataType in the dataTypeExpression + while ( ( dataType = dataTypes[ i++ ] ) ) { + + // Prepend if requested + if ( dataType[ 0 ] === "+" ) { + dataType = dataType.slice( 1 ) || "*"; + ( structure[ dataType ] = structure[ dataType ] || [] ).unshift( func ); + + // Otherwise append + } else { + ( structure[ dataType ] = structure[ dataType ] || [] ).push( func ); + } + } + } + }; +} + +// Base inspection function for prefilters and transports +function inspectPrefiltersOrTransports( structure, options, originalOptions, jqXHR ) { + + var inspected = {}, + seekingTransport = ( structure === transports ); + + function inspect( dataType ) { + var selected; + inspected[ dataType ] = true; + jQuery.each( structure[ dataType ] || [], function( _, prefilterOrFactory ) { + var dataTypeOrTransport = prefilterOrFactory( options, originalOptions, jqXHR ); + if ( typeof dataTypeOrTransport === "string" && + !seekingTransport && !inspected[ dataTypeOrTransport ] ) { + + options.dataTypes.unshift( dataTypeOrTransport ); + inspect( dataTypeOrTransport ); + return false; + } else if ( seekingTransport ) { + return !( selected = dataTypeOrTransport ); + } + } ); + return selected; + } + + return inspect( options.dataTypes[ 0 ] ) || !inspected[ "*" ] && inspect( "*" ); +} + +// A special extend for ajax options +// that takes "flat" options (not to be deep extended) +// Fixes #9887 +function ajaxExtend( target, src ) { + var key, deep, + flatOptions = jQuery.ajaxSettings.flatOptions || {}; + + for ( key in src ) { + if ( src[ key ] !== undefined ) { + ( flatOptions[ key ] ? target : ( deep || ( deep = {} ) ) )[ key ] = src[ key ]; + } + } + if ( deep ) { + jQuery.extend( true, target, deep ); + } + + return target; +} + +/* Handles responses to an ajax request: + * - finds the right dataType (mediates between content-type and expected dataType) + * - returns the corresponding response + */ +function ajaxHandleResponses( s, jqXHR, responses ) { + + var ct, type, finalDataType, firstDataType, + contents = s.contents, + dataTypes = s.dataTypes; + + // Remove auto dataType and get content-type in the process + while ( dataTypes[ 0 ] === "*" ) { + dataTypes.shift(); + if ( ct === undefined ) { + ct = s.mimeType || jqXHR.getResponseHeader( "Content-Type" ); + } + } + + // Check if we're dealing with a known content-type + if ( ct ) { + for ( type in contents ) { + if ( contents[ type ] && contents[ type ].test( ct ) ) { + dataTypes.unshift( type ); + break; + } + } + } + + // Check to see if we have a response for the expected dataType + if ( dataTypes[ 0 ] in responses ) { + finalDataType = dataTypes[ 0 ]; + } else { + + // Try convertible dataTypes + for ( type in responses ) { + if ( !dataTypes[ 0 ] || s.converters[ type + " " + dataTypes[ 0 ] ] ) { + finalDataType = type; + break; + } + if ( !firstDataType ) { + firstDataType = type; + } + } + + // Or just use first one + finalDataType = finalDataType || firstDataType; + } + + // If we found a dataType + // We add the dataType to the list if needed + // and return the corresponding response + if ( finalDataType ) { + if ( finalDataType !== dataTypes[ 0 ] ) { + dataTypes.unshift( finalDataType ); + } + return responses[ finalDataType ]; + } +} + +/* Chain conversions given the request and the original response + * Also sets the responseXXX fields on the jqXHR instance + */ +function ajaxConvert( s, response, jqXHR, isSuccess ) { + var conv2, current, conv, tmp, prev, + converters = {}, + + // Work with a copy of dataTypes in case we need to modify it for conversion + dataTypes = s.dataTypes.slice(); + + // Create converters map with lowercased keys + if ( dataTypes[ 1 ] ) { + for ( conv in s.converters ) { + converters[ conv.toLowerCase() ] = s.converters[ conv ]; + } + } + + current = dataTypes.shift(); + + // Convert to each sequential dataType + while ( current ) { + + if ( s.responseFields[ current ] ) { + jqXHR[ s.responseFields[ current ] ] = response; + } + + // Apply the dataFilter if provided + if ( !prev && isSuccess && s.dataFilter ) { + response = s.dataFilter( response, s.dataType ); + } + + prev = current; + current = dataTypes.shift(); + + if ( current ) { + + // There's only work to do if current dataType is non-auto + if ( current === "*" ) { + + current = prev; + + // Convert response if prev dataType is non-auto and differs from current + } else if ( prev !== "*" && prev !== current ) { + + // Seek a direct converter + conv = converters[ prev + " " + current ] || converters[ "* " + current ]; + + // If none found, seek a pair + if ( !conv ) { + for ( conv2 in converters ) { + + // If conv2 outputs current + tmp = conv2.split( " " ); + if ( tmp[ 1 ] === current ) { + + // If prev can be converted to accepted input + conv = converters[ prev + " " + tmp[ 0 ] ] || + converters[ "* " + tmp[ 0 ] ]; + if ( conv ) { + + // Condense equivalence converters + if ( conv === true ) { + conv = converters[ conv2 ]; + + // Otherwise, insert the intermediate dataType + } else if ( converters[ conv2 ] !== true ) { + current = tmp[ 0 ]; + dataTypes.unshift( tmp[ 1 ] ); + } + break; + } + } + } + } + + // Apply converter (if not an equivalence) + if ( conv !== true ) { + + // Unless errors are allowed to bubble, catch and return them + if ( conv && s.throws ) { + response = conv( response ); + } else { + try { + response = conv( response ); + } catch ( e ) { + return { + state: "parsererror", + error: conv ? e : "No conversion from " + prev + " to " + current + }; + } + } + } + } + } + } + + return { state: "success", data: response }; +} + +jQuery.extend( { + + // Counter for holding the number of active queries + active: 0, + + // Last-Modified header cache for next request + lastModified: {}, + etag: {}, + + ajaxSettings: { + url: location.href, + type: "GET", + isLocal: rlocalProtocol.test( location.protocol ), + global: true, + processData: true, + async: true, + contentType: "application/x-www-form-urlencoded; charset=UTF-8", + + /* + timeout: 0, + data: null, + dataType: null, + username: null, + password: null, + cache: null, + throws: false, + traditional: false, + headers: {}, + */ + + accepts: { + "*": allTypes, + text: "text/plain", + html: "text/html", + xml: "application/xml, text/xml", + json: "application/json, text/javascript" + }, + + contents: { + xml: /\bxml\b/, + html: /\bhtml/, + json: /\bjson\b/ + }, + + responseFields: { + xml: "responseXML", + text: "responseText", + json: "responseJSON" + }, + + // Data converters + // Keys separate source (or catchall "*") and destination types with a single space + converters: { + + // Convert anything to text + "* text": String, + + // Text to html (true = no transformation) + "text html": true, + + // Evaluate text as a json expression + "text json": JSON.parse, + + // Parse text as xml + "text xml": jQuery.parseXML + }, + + // For options that shouldn't be deep extended: + // you can add your own custom options here if + // and when you create one that shouldn't be + // deep extended (see ajaxExtend) + flatOptions: { + url: true, + context: true + } + }, + + // Creates a full fledged settings object into target + // with both ajaxSettings and settings fields. + // If target is omitted, writes into ajaxSettings. + ajaxSetup: function( target, settings ) { + return settings ? + + // Building a settings object + ajaxExtend( ajaxExtend( target, jQuery.ajaxSettings ), settings ) : + + // Extending ajaxSettings + ajaxExtend( jQuery.ajaxSettings, target ); + }, + + ajaxPrefilter: addToPrefiltersOrTransports( prefilters ), + ajaxTransport: addToPrefiltersOrTransports( transports ), + + // Main method + ajax: function( url, options ) { + + // If url is an object, simulate pre-1.5 signature + if ( typeof url === "object" ) { + options = url; + url = undefined; + } + + // Force options to be an object + options = options || {}; + + var transport, + + // URL without anti-cache param + cacheURL, + + // Response headers + responseHeadersString, + responseHeaders, + + // timeout handle + timeoutTimer, + + // Url cleanup var + urlAnchor, + + // Request state (becomes false upon send and true upon completion) + completed, + + // To know if global events are to be dispatched + fireGlobals, + + // Loop variable + i, + + // uncached part of the url + uncached, + + // Create the final options object + s = jQuery.ajaxSetup( {}, options ), + + // Callbacks context + callbackContext = s.context || s, + + // Context for global events is callbackContext if it is a DOM node or jQuery collection + globalEventContext = s.context && + ( callbackContext.nodeType || callbackContext.jquery ) ? + jQuery( callbackContext ) : + jQuery.event, + + // Deferreds + deferred = jQuery.Deferred(), + completeDeferred = jQuery.Callbacks( "once memory" ), + + // Status-dependent callbacks + statusCode = s.statusCode || {}, + + // Headers (they are sent all at once) + requestHeaders = {}, + requestHeadersNames = {}, + + // Default abort message + strAbort = "canceled", + + // Fake xhr + jqXHR = { + readyState: 0, + + // Builds headers hashtable if needed + getResponseHeader: function( key ) { + var match; + if ( completed ) { + if ( !responseHeaders ) { + responseHeaders = {}; + while ( ( match = rheaders.exec( responseHeadersString ) ) ) { + responseHeaders[ match[ 1 ].toLowerCase() + " " ] = + ( responseHeaders[ match[ 1 ].toLowerCase() + " " ] || [] ) + .concat( match[ 2 ] ); + } + } + match = responseHeaders[ key.toLowerCase() + " " ]; + } + return match == null ? null : match.join( ", " ); + }, + + // Raw string + getAllResponseHeaders: function() { + return completed ? responseHeadersString : null; + }, + + // Caches the header + setRequestHeader: function( name, value ) { + if ( completed == null ) { + name = requestHeadersNames[ name.toLowerCase() ] = + requestHeadersNames[ name.toLowerCase() ] || name; + requestHeaders[ name ] = value; + } + return this; + }, + + // Overrides response content-type header + overrideMimeType: function( type ) { + if ( completed == null ) { + s.mimeType = type; + } + return this; + }, + + // Status-dependent callbacks + statusCode: function( map ) { + var code; + if ( map ) { + if ( completed ) { + + // Execute the appropriate callbacks + jqXHR.always( map[ jqXHR.status ] ); + } else { + + // Lazy-add the new callbacks in a way that preserves old ones + for ( code in map ) { + statusCode[ code ] = [ statusCode[ code ], map[ code ] ]; + } + } + } + return this; + }, + + // Cancel the request + abort: function( statusText ) { + var finalText = statusText || strAbort; + if ( transport ) { + transport.abort( finalText ); + } + done( 0, finalText ); + return this; + } + }; + + // Attach deferreds + deferred.promise( jqXHR ); + + // Add protocol if not provided (prefilters might expect it) + // Handle falsy url in the settings object (#10093: consistency with old signature) + // We also use the url parameter if available + s.url = ( ( url || s.url || location.href ) + "" ) + .replace( rprotocol, location.protocol + "//" ); + + // Alias method option to type as per ticket #12004 + s.type = options.method || options.type || s.method || s.type; + + // Extract dataTypes list + s.dataTypes = ( s.dataType || "*" ).toLowerCase().match( rnothtmlwhite ) || [ "" ]; + + // A cross-domain request is in order when the origin doesn't match the current origin. + if ( s.crossDomain == null ) { + urlAnchor = document.createElement( "a" ); + + // Support: IE <=8 - 11, Edge 12 - 15 + // IE throws exception on accessing the href property if url is malformed, + // e.g. http://example.com:80x/ + try { + urlAnchor.href = s.url; + + // Support: IE <=8 - 11 only + // Anchor's host property isn't correctly set when s.url is relative + urlAnchor.href = urlAnchor.href; + s.crossDomain = originAnchor.protocol + "//" + originAnchor.host !== + urlAnchor.protocol + "//" + urlAnchor.host; + } catch ( e ) { + + // If there is an error parsing the URL, assume it is crossDomain, + // it can be rejected by the transport if it is invalid + s.crossDomain = true; + } + } + + // Convert data if not already a string + if ( s.data && s.processData && typeof s.data !== "string" ) { + s.data = jQuery.param( s.data, s.traditional ); + } + + // Apply prefilters + inspectPrefiltersOrTransports( prefilters, s, options, jqXHR ); + + // If request was aborted inside a prefilter, stop there + if ( completed ) { + return jqXHR; + } + + // We can fire global events as of now if asked to + // Don't fire events if jQuery.event is undefined in an AMD-usage scenario (#15118) + fireGlobals = jQuery.event && s.global; + + // Watch for a new set of requests + if ( fireGlobals && jQuery.active++ === 0 ) { + jQuery.event.trigger( "ajaxStart" ); + } + + // Uppercase the type + s.type = s.type.toUpperCase(); + + // Determine if request has content + s.hasContent = !rnoContent.test( s.type ); + + // Save the URL in case we're toying with the If-Modified-Since + // and/or If-None-Match header later on + // Remove hash to simplify url manipulation + cacheURL = s.url.replace( rhash, "" ); + + // More options handling for requests with no content + if ( !s.hasContent ) { + + // Remember the hash so we can put it back + uncached = s.url.slice( cacheURL.length ); + + // If data is available and should be processed, append data to url + if ( s.data && ( s.processData || typeof s.data === "string" ) ) { + cacheURL += ( rquery.test( cacheURL ) ? "&" : "?" ) + s.data; + + // #9682: remove data so that it's not used in an eventual retry + delete s.data; + } + + // Add or update anti-cache param if needed + if ( s.cache === false ) { + cacheURL = cacheURL.replace( rantiCache, "$1" ); + uncached = ( rquery.test( cacheURL ) ? "&" : "?" ) + "_=" + ( nonce.guid++ ) + + uncached; + } + + // Put hash and anti-cache on the URL that will be requested (gh-1732) + s.url = cacheURL + uncached; + + // Change '%20' to '+' if this is encoded form body content (gh-2658) + } else if ( s.data && s.processData && + ( s.contentType || "" ).indexOf( "application/x-www-form-urlencoded" ) === 0 ) { + s.data = s.data.replace( r20, "+" ); + } + + // Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode. + if ( s.ifModified ) { + if ( jQuery.lastModified[ cacheURL ] ) { + jqXHR.setRequestHeader( "If-Modified-Since", jQuery.lastModified[ cacheURL ] ); + } + if ( jQuery.etag[ cacheURL ] ) { + jqXHR.setRequestHeader( "If-None-Match", jQuery.etag[ cacheURL ] ); + } + } + + // Set the correct header, if data is being sent + if ( s.data && s.hasContent && s.contentType !== false || options.contentType ) { + jqXHR.setRequestHeader( "Content-Type", s.contentType ); + } + + // Set the Accepts header for the server, depending on the dataType + jqXHR.setRequestHeader( + "Accept", + s.dataTypes[ 0 ] && s.accepts[ s.dataTypes[ 0 ] ] ? + s.accepts[ s.dataTypes[ 0 ] ] + + ( s.dataTypes[ 0 ] !== "*" ? ", " + allTypes + "; q=0.01" : "" ) : + s.accepts[ "*" ] + ); + + // Check for headers option + for ( i in s.headers ) { + jqXHR.setRequestHeader( i, s.headers[ i ] ); + } + + // Allow custom headers/mimetypes and early abort + if ( s.beforeSend && + ( s.beforeSend.call( callbackContext, jqXHR, s ) === false || completed ) ) { + + // Abort if not done already and return + return jqXHR.abort(); + } + + // Aborting is no longer a cancellation + strAbort = "abort"; + + // Install callbacks on deferreds + completeDeferred.add( s.complete ); + jqXHR.done( s.success ); + jqXHR.fail( s.error ); + + // Get transport + transport = inspectPrefiltersOrTransports( transports, s, options, jqXHR ); + + // If no transport, we auto-abort + if ( !transport ) { + done( -1, "No Transport" ); + } else { + jqXHR.readyState = 1; + + // Send global event + if ( fireGlobals ) { + globalEventContext.trigger( "ajaxSend", [ jqXHR, s ] ); + } + + // If request was aborted inside ajaxSend, stop there + if ( completed ) { + return jqXHR; + } + + // Timeout + if ( s.async && s.timeout > 0 ) { + timeoutTimer = window.setTimeout( function() { + jqXHR.abort( "timeout" ); + }, s.timeout ); + } + + try { + completed = false; + transport.send( requestHeaders, done ); + } catch ( e ) { + + // Rethrow post-completion exceptions + if ( completed ) { + throw e; + } + + // Propagate others as results + done( -1, e ); + } + } + + // Callback for when everything is done + function done( status, nativeStatusText, responses, headers ) { + var isSuccess, success, error, response, modified, + statusText = nativeStatusText; + + // Ignore repeat invocations + if ( completed ) { + return; + } + + completed = true; + + // Clear timeout if it exists + if ( timeoutTimer ) { + window.clearTimeout( timeoutTimer ); + } + + // Dereference transport for early garbage collection + // (no matter how long the jqXHR object will be used) + transport = undefined; + + // Cache response headers + responseHeadersString = headers || ""; + + // Set readyState + jqXHR.readyState = status > 0 ? 4 : 0; + + // Determine if successful + isSuccess = status >= 200 && status < 300 || status === 304; + + // Get response data + if ( responses ) { + response = ajaxHandleResponses( s, jqXHR, responses ); + } + + // Use a noop converter for missing script + if ( !isSuccess && jQuery.inArray( "script", s.dataTypes ) > -1 ) { + s.converters[ "text script" ] = function() {}; + } + + // Convert no matter what (that way responseXXX fields are always set) + response = ajaxConvert( s, response, jqXHR, isSuccess ); + + // If successful, handle type chaining + if ( isSuccess ) { + + // Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode. + if ( s.ifModified ) { + modified = jqXHR.getResponseHeader( "Last-Modified" ); + if ( modified ) { + jQuery.lastModified[ cacheURL ] = modified; + } + modified = jqXHR.getResponseHeader( "etag" ); + if ( modified ) { + jQuery.etag[ cacheURL ] = modified; + } + } + + // if no content + if ( status === 204 || s.type === "HEAD" ) { + statusText = "nocontent"; + + // if not modified + } else if ( status === 304 ) { + statusText = "notmodified"; + + // If we have data, let's convert it + } else { + statusText = response.state; + success = response.data; + error = response.error; + isSuccess = !error; + } + } else { + + // Extract error from statusText and normalize for non-aborts + error = statusText; + if ( status || !statusText ) { + statusText = "error"; + if ( status < 0 ) { + status = 0; + } + } + } + + // Set data for the fake xhr object + jqXHR.status = status; + jqXHR.statusText = ( nativeStatusText || statusText ) + ""; + + // Success/Error + if ( isSuccess ) { + deferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] ); + } else { + deferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] ); + } + + // Status-dependent callbacks + jqXHR.statusCode( statusCode ); + statusCode = undefined; + + if ( fireGlobals ) { + globalEventContext.trigger( isSuccess ? "ajaxSuccess" : "ajaxError", + [ jqXHR, s, isSuccess ? success : error ] ); + } + + // Complete + completeDeferred.fireWith( callbackContext, [ jqXHR, statusText ] ); + + if ( fireGlobals ) { + globalEventContext.trigger( "ajaxComplete", [ jqXHR, s ] ); + + // Handle the global AJAX counter + if ( !( --jQuery.active ) ) { + jQuery.event.trigger( "ajaxStop" ); + } + } + } + + return jqXHR; + }, + + getJSON: function( url, data, callback ) { + return jQuery.get( url, data, callback, "json" ); + }, + + getScript: function( url, callback ) { + return jQuery.get( url, undefined, callback, "script" ); + } +} ); + +jQuery.each( [ "get", "post" ], function( _i, method ) { + jQuery[ method ] = function( url, data, callback, type ) { + + // Shift arguments if data argument was omitted + if ( isFunction( data ) ) { + type = type || callback; + callback = data; + data = undefined; + } + + // The url can be an options object (which then must have .url) + return jQuery.ajax( jQuery.extend( { + url: url, + type: method, + dataType: type, + data: data, + success: callback + }, jQuery.isPlainObject( url ) && url ) ); + }; +} ); + +jQuery.ajaxPrefilter( function( s ) { + var i; + for ( i in s.headers ) { + if ( i.toLowerCase() === "content-type" ) { + s.contentType = s.headers[ i ] || ""; + } + } +} ); + + +jQuery._evalUrl = function( url, options, doc ) { + return jQuery.ajax( { + url: url, + + // Make this explicit, since user can override this through ajaxSetup (#11264) + type: "GET", + dataType: "script", + cache: true, + async: false, + global: false, + + // Only evaluate the response if it is successful (gh-4126) + // dataFilter is not invoked for failure responses, so using it instead + // of the default converter is kludgy but it works. + converters: { + "text script": function() {} + }, + dataFilter: function( response ) { + jQuery.globalEval( response, options, doc ); + } + } ); +}; + + +jQuery.fn.extend( { + wrapAll: function( html ) { + var wrap; + + if ( this[ 0 ] ) { + if ( isFunction( html ) ) { + html = html.call( this[ 0 ] ); + } + + // The elements to wrap the target around + wrap = jQuery( html, this[ 0 ].ownerDocument ).eq( 0 ).clone( true ); + + if ( this[ 0 ].parentNode ) { + wrap.insertBefore( this[ 0 ] ); + } + + wrap.map( function() { + var elem = this; + + while ( elem.firstElementChild ) { + elem = elem.firstElementChild; + } + + return elem; + } ).append( this ); + } + + return this; + }, + + wrapInner: function( html ) { + if ( isFunction( html ) ) { + return this.each( function( i ) { + jQuery( this ).wrapInner( html.call( this, i ) ); + } ); + } + + return this.each( function() { + var self = jQuery( this ), + contents = self.contents(); + + if ( contents.length ) { + contents.wrapAll( html ); + + } else { + self.append( html ); + } + } ); + }, + + wrap: function( html ) { + var htmlIsFunction = isFunction( html ); + + return this.each( function( i ) { + jQuery( this ).wrapAll( htmlIsFunction ? html.call( this, i ) : html ); + } ); + }, + + unwrap: function( selector ) { + this.parent( selector ).not( "body" ).each( function() { + jQuery( this ).replaceWith( this.childNodes ); + } ); + return this; + } +} ); + + +jQuery.expr.pseudos.hidden = function( elem ) { + return !jQuery.expr.pseudos.visible( elem ); +}; +jQuery.expr.pseudos.visible = function( elem ) { + return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length ); +}; + + + + +jQuery.ajaxSettings.xhr = function() { + try { + return new window.XMLHttpRequest(); + } catch ( e ) {} +}; + +var xhrSuccessStatus = { + + // File protocol always yields status code 0, assume 200 + 0: 200, + + // Support: IE <=9 only + // #1450: sometimes IE returns 1223 when it should be 204 + 1223: 204 + }, + xhrSupported = jQuery.ajaxSettings.xhr(); + +support.cors = !!xhrSupported && ( "withCredentials" in xhrSupported ); +support.ajax = xhrSupported = !!xhrSupported; + +jQuery.ajaxTransport( function( options ) { + var callback, errorCallback; + + // Cross domain only allowed if supported through XMLHttpRequest + if ( support.cors || xhrSupported && !options.crossDomain ) { + return { + send: function( headers, complete ) { + var i, + xhr = options.xhr(); + + xhr.open( + options.type, + options.url, + options.async, + options.username, + options.password + ); + + // Apply custom fields if provided + if ( options.xhrFields ) { + for ( i in options.xhrFields ) { + xhr[ i ] = options.xhrFields[ i ]; + } + } + + // Override mime type if needed + if ( options.mimeType && xhr.overrideMimeType ) { + xhr.overrideMimeType( options.mimeType ); + } + + // X-Requested-With header + // For cross-domain requests, seeing as conditions for a preflight are + // akin to a jigsaw puzzle, we simply never set it to be sure. + // (it can always be set on a per-request basis or even using ajaxSetup) + // For same-domain requests, won't change header if already provided. + if ( !options.crossDomain && !headers[ "X-Requested-With" ] ) { + headers[ "X-Requested-With" ] = "XMLHttpRequest"; + } + + // Set headers + for ( i in headers ) { + xhr.setRequestHeader( i, headers[ i ] ); + } + + // Callback + callback = function( type ) { + return function() { + if ( callback ) { + callback = errorCallback = xhr.onload = + xhr.onerror = xhr.onabort = xhr.ontimeout = + xhr.onreadystatechange = null; + + if ( type === "abort" ) { + xhr.abort(); + } else if ( type === "error" ) { + + // Support: IE <=9 only + // On a manual native abort, IE9 throws + // errors on any property access that is not readyState + if ( typeof xhr.status !== "number" ) { + complete( 0, "error" ); + } else { + complete( + + // File: protocol always yields status 0; see #8605, #14207 + xhr.status, + xhr.statusText + ); + } + } else { + complete( + xhrSuccessStatus[ xhr.status ] || xhr.status, + xhr.statusText, + + // Support: IE <=9 only + // IE9 has no XHR2 but throws on binary (trac-11426) + // For XHR2 non-text, let the caller handle it (gh-2498) + ( xhr.responseType || "text" ) !== "text" || + typeof xhr.responseText !== "string" ? + { binary: xhr.response } : + { text: xhr.responseText }, + xhr.getAllResponseHeaders() + ); + } + } + }; + }; + + // Listen to events + xhr.onload = callback(); + errorCallback = xhr.onerror = xhr.ontimeout = callback( "error" ); + + // Support: IE 9 only + // Use onreadystatechange to replace onabort + // to handle uncaught aborts + if ( xhr.onabort !== undefined ) { + xhr.onabort = errorCallback; + } else { + xhr.onreadystatechange = function() { + + // Check readyState before timeout as it changes + if ( xhr.readyState === 4 ) { + + // Allow onerror to be called first, + // but that will not handle a native abort + // Also, save errorCallback to a variable + // as xhr.onerror cannot be accessed + window.setTimeout( function() { + if ( callback ) { + errorCallback(); + } + } ); + } + }; + } + + // Create the abort callback + callback = callback( "abort" ); + + try { + + // Do send the request (this may raise an exception) + xhr.send( options.hasContent && options.data || null ); + } catch ( e ) { + + // #14683: Only rethrow if this hasn't been notified as an error yet + if ( callback ) { + throw e; + } + } + }, + + abort: function() { + if ( callback ) { + callback(); + } + } + }; + } +} ); + + + + +// Prevent auto-execution of scripts when no explicit dataType was provided (See gh-2432) +jQuery.ajaxPrefilter( function( s ) { + if ( s.crossDomain ) { + s.contents.script = false; + } +} ); + +// Install script dataType +jQuery.ajaxSetup( { + accepts: { + script: "text/javascript, application/javascript, " + + "application/ecmascript, application/x-ecmascript" + }, + contents: { + script: /\b(?:java|ecma)script\b/ + }, + converters: { + "text script": function( text ) { + jQuery.globalEval( text ); + return text; + } + } +} ); + +// Handle cache's special case and crossDomain +jQuery.ajaxPrefilter( "script", function( s ) { + if ( s.cache === undefined ) { + s.cache = false; + } + if ( s.crossDomain ) { + s.type = "GET"; + } +} ); + +// Bind script tag hack transport +jQuery.ajaxTransport( "script", function( s ) { + + // This transport only deals with cross domain or forced-by-attrs requests + if ( s.crossDomain || s.scriptAttrs ) { + var script, callback; + return { + send: function( _, complete ) { + script = jQuery( "