/*
 * Created by Robert Xie
 * © 2015 HIT Microsoft Club
 * All Rights Reserved
 */

.win-pivot-item .win-pivot-item-content {
    padding: 0 0 0 12px;
}

.dynamics {
    padding: 0 !important;
}

.dynamics #dynamics-list {
    width: 100%;
}

.dynamics #dynamics-list .dynamics-content {
    padding: 7px 14px;
    margin: 10px 30px 10px 0;
    font-size: 14px;
}

.dynamics #dynamics-list .dynamics-content > .dynamics-id {
    display: none;
}

.dynamics #dynamics-list .dynamics-content > .dtitle {
    font-weight: bold;
}

.dynamics #dynamics-list .dynamics-content > .dauthor {
    font-weight: normal;
    margin: 0;
}

.dynamics #dynamics-list .dynamics-content > .ddate {
    font-weight: 200;
    margin: 0;
}

.text {
    font-family: "Segoe UI", "Microsoft YaHei UI", sans-serif, "Segoe MDL2 Assets", "Symbols";
    overflow-y: auto;
    padding: 30px !important;
}

.text.mobile {
    background-color: #ffffff;
}

.first-row .mif-arrow-left {
    text-decoration: none !important;
    color: #ffffff;
    font-size: 4.0rem;
    font-weight: 200;
    line-height: 1.216;
    letter-spacing: 0;
    margin-bottom: 7px;
    margin-right: 20px;
    float: left;
}

.first-row .mif-arrow-left:hover {
    color: #cdcdcd;
}

.first-row #title {
    font-size: 4.0rem;
    font-weight: 200;
    line-height: 1.216;
    letter-spacing: 0;
    margin-bottom: 7px;
}

.text > #text-content > #title {
    font-size: 4.0rem;
    font-weight: 200;
    line-height: 1.216;
    letter-spacing: 0;
    margin-bottom: 7px;
}

.text > #text-content > #author {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.2;
    float: left;
    margin-top: 7px;
    margin-bottom: 14px;
}

.text > #text-content > #publish-date {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.2;
    float: left;
    margin-top: 7px;
    margin-bottom: 14px;
    margin-left: 7px;
}

.text > #text-content > #form > .win-button {
    color: #000000;
    background-color: rgba(0, 0, 0, 0.2);
    border-color: transparent;
}

.text > #text-content > #form > .win-button:hover {
    border-color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #form > .win-button:active {
    background-color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #form > .win-button:disabled {
    color: rgba(0, 0, 0, 0.2);
    background-color: rgba(0, 0, 0, 0.2);
    border-color: transparent;
}

.text > #text-content > #main {
    font-size: 1.6rem !important;
    font-weight: 400;
    line-height: 1.333 !important;
    padding-bottom: 10px;
    clear: both;
}

.text > #text-content > #main h1 {
    font-size: 4.0rem !important;
    font-weight: 200;
    line-height: 1.216 !important;
    letter-spacing: 0;
}

.text > #text-content > #main h2 {
    font-size: 3.0rem !important;
    font-weight: 200;
    line-height: 1.176 !important;
}

.text > #text-content > #main h3 {
    font-size: 2.1rem !important;
    font-weight: 300;
    line-height: 1.167 !important;
}

.text > #text-content > #main h4 {
    font-size: 1.75rem !important;
    font-weight: 400;
    line-height: 1.2 !important;
}

.text > #text-content > #main h5 {
    font-size: 1.6rem !important;
    font-weight: 500;
    line-height: 1.333 !important;
}

.text > #text-content > #main * {
    word-break: break-all;
    font-size: 1.6rem !important;
    font-weight: 400;
    line-height: 1.333 !important;
    margin-top: 10px;
    margin-bottom: 10px;
}

.text > #text-content > #main code, pre {
    font-family: "Source Code Pro", "Consolas", "Courier New", "Microsoft YaHei UI", monospace;
}

.text > #text-content > #main img {
    width: 100%;
    height: auto;
}

.text > #text-content > #main .code {
    margin: 0;
}

.text > #text-content > #main .code-toolbar {
    font-family: "Segoe UI", "Microsoft YaHei UI", sans-serif, "Segoe MDL2 Assets", "Symbols";
    position: absolute;
    width: calc(100% - 60px);
    color: #ffffff;
    margin: -0.7%;
    padding: 5px 10px;
    background-color: #999999;
}

.text > #text-content > #main .code-toolbar > .code-language {
    margin: 0;
    float: left;
}

.text > #text-content > #main .code-toolbar > .code-copy {
    margin: 0;
    float: right;
    cursor: pointer;
    color: #ffffff;
    text-decoration: none;
}

/*
   Styled <table> from Metro UI CSS
   Usage: <table class="table striped hovered cell-hovered border bordered">...</table>

   ======================================
              The MIT License
   ======================================

   Copyright (c) 2012-2015 Sergey Pimenov

   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.
*/

.text > #text-content > #main table {
    width: 100%;
    margin: .625rem 0;
}

.text > #text-content > #main table th,
.text > #text-content > #main table td {
    padding: 0.625rem;
}

.text > #text-content > #main table thead {
    border-bottom: 4px solid #999999;
}

.text > #text-content > #main table thead th,
.text > #text-content > #main table thead td {
    cursor: default;
    color: #52677a;
    border-color: transparent;
    text-align: left;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
}

.text > #text-content > #main table tfoot {
    border-top: 4px solid #999999;
}

.text > #text-content > #main table tfoot th,
.text > #text-content > #main table tfoot td {
    cursor: default;
    color: #52677a;
    border-color: transparent;
    text-align: left;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
}

.text > #text-content > #main table tbody td {
    padding: 0.625rem 0.85rem;
}

.text > #text-content > #main table.striped tbody tr:nth-child(odd) {
    background: #eeeeee;
}

.text > #text-content > #main table.hovered tbody tr:hover {
    background-color: rgba(0, 120, 215, 0.1);
}

.text > #text-content > #main table.cell-hovered tbody td:hover {
    background-color: rgba(0, 120, 215, 0.3);
}

.text > #text-content > #main table.border {
    border: 1px #999999 solid;
}

.text > #text-content > #main table.bordered th,
.text > #text-content > #main table.bordered td {
    border: 1px #999999 solid;
}

.text > #text-content > #main table.bordered thead tr:first-child th,
.text > #text-content > #main table.bordered thead tr:first-child td {
    border-top: none;
}

.text > #text-content > #main table.bordered thead tr:first-child th:first-child,
.text > #text-content > #main table.bordered thead tr:first-child td:first-child {
    border-left: none;
}

.text > #text-content > #main table.bordered thead tr:first-child th:last-child,
.text > #text-content > #main table.bordered thead tr:first-child td:last-child {
    border-right: none;
}

.text > #text-content > #main table.bordered tbody tr:first-child td {
    border-top: none;
}

.text > #text-content > #main table.bordered tbody tr td:first-child {
    border-left: none;
}

.text > #text-content > #main table.bordered tbody tr td:last-child {
    border-right: none;
}

.text > #text-content > #main table.bordered tbody tr:last-child td {
    border-bottom: none;
}

.text > #text-content > #main table .condensed th,
.text > #text-content > #main table .condensed td {
    padding: .3125rem;
}

.text > #text-content > #main table .super-condensed th,
.text > #text-content > #main table .super-condensed td {
    padding: .125rem;
}

.text > #text-content > #main table tbody tr.error {
    background-color: #ce352c;
    color: #ffffff;
}

.text > #text-content > #main table tbody tr.error:hover {
    background-color: #da5a53;
}

.text > #text-content > #main table tbody tr.warning {
    background-color: #fa6800;
    color: #ffffff;
}

.text > #text-content > #main table tbody tr.warning:hover {
    background-color: #ffc194;
}

.text > #text-content > #main table tbody tr.success {
    background-color: #60a917;
    color: #ffffff;
}

.text > #text-content > #main table tbody tr.success:hover {
    background-color: #7ad61d;
}

.text > #text-content > #main table tbody tr.info {
    background-color: #1ba1e2;
    color: #ffffff;
}

.text > #text-content > #main table tbody tr.info:hover {
    background-color: #59cde2;
}

.text > #text-content > #main input[type=checkbox]::-ms-check {
    color: #000000;
    border-color: rgba(0, 0, 0, 0.8);
    background-color: transparent;
}

.text > #text-content > #main input[type=checkbox]:indeterminate::-ms-check {
    color: rgba(0, 0, 0, 0.8);
}

.text > #text-content > #main input[type=checkbox]:checked::-ms-check {
    color: #fff;
    border-color: transparent;
}

.text > #text-content > #main input[type=checkbox]:hover::-ms-check {
    border-color: #000000;
}

.text > #text-content > #main input[type=checkbox]:hover:indeterminate::-ms-check {
    color: #000000;
}

.text > #text-content > #main input[type=checkbox]:active::-ms-check {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=checkbox]:indeterminate:active::-ms-check {
    color: rgba(0, 0, 0, 0.6);
    border-color: rgba(0, 0, 0, 0.8);
    background-color: transparent;
}

.text > #text-content > #main input[type=checkbox]:disabled::-ms-check,
.text > #text-content > #main input[type=checkbox]:indeterminate:disabled::-ms-check {
    color: rgba(0, 0, 0, 0.2);
    border-color: rgba(0, 0, 0, 0.2);
    background-color: transparent;
}

.text > #text-content > #main input[type=radio]::-ms-check {
    color: rgba(0, 0, 0, 0.8);
    border-color: rgba(0, 0, 0, 0.8);
    background-color: transparent;
}

.text > #text-content > #main input[type=radio]:hover::-ms-check {
    border-color: #000000;
}

.text > #text-content > #main input[type=radio]:hover::-ms-check {
    color: #000000;
}

.text > #text-content > #main input[type=radio]:active::-ms-check {
    color: rgba(0, 0, 0, 0.6);
    border-color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=radio]:disabled::-ms-check {
    color: rgba(0, 0, 0, 0.2);
    border-color: rgba(0, 0, 0, 0.2);
}

.text > #text-content > #main input[type=button],
.text > #text-content > #main input[type=reset],
.text > #text-content > #main input[type=submit] {
    color: #000000;
    background-color: rgba(0, 0, 0, 0.2);
    border-color: transparent;
}

.text > #text-content > #main input[type=button].primary,
.text > #text-content > #main input[type=reset].primary,
.text > #text-content > #main input[type=submit].primary {
    color: #fff;
}

.text > #text-content > #main input[type=button]:hover,
.text > #text-content > #main input[type=button].primary:hover,
.text > #text-content > #main input[type=reset]:hover,
.text > #text-content > #main input[type=reset].primary:hover,
.text > #text-content > #main input[type=submit]:hover,
.text > #text-content > #main input[type=submit].primary:hover {
    border-color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=button]:active,
.text > #text-content > #main input[type=button].primary:active,
.text > #text-content > #main input[type=reset]:active,
.text > #text-content > #main input[type=reset].primary:active,
.text > #text-content > #main input[type=submit]:active,
.text > #text-content > #main input[type=submit].primary:active {
    background-color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=button]:disabled,
.text > #text-content > #main input[type=button].primary:disabled,
.text > #text-content > #main input[type=reset]:disabled,
.text > #text-content > #main input[type=reset].primary:disabled,
.text > #text-content > #main input[type=submit]:disabled,
.text > #text-content > #main input[type=submit].primary:disabled {
    color: rgba(0, 0, 0, 0.2);
    background-color: rgba(0, 0, 0, 0.2);
    border-color: transparent;
}

.text > #text-content > #main input[type=range] {
    background-color: transparent;
}

.text > #text-content > #main input[type=range]:hover::-ms-thumb {
    background: #1f1f1f;
}

.text > #text-content > #main input[type=range]:hover::-webkit-slider-thumb {
    background: #1f1f1f;
}

.text > #text-content > #main input[type=range]:hover::-moz-range-thumb {
    background: #1f1f1f;
}

.text > #text-content > #main input[type=range]:active::-ms-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:active::-webkit-slider-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:active::-moz-range-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:disabled::-ms-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:disabled::-webkit-slider-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:disabled::-moz-range-thumb {
    background: #cccccc;
}

.text > #text-content > #main input[type=range]:disabled::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.2);
}

.text > #text-content > #main input[type=range]::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]::-webkit-slider-runnable-track {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]::-moz-range-track {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]:active::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]:active::-webkit-slider-runnable-track {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]:active::-moz-range-track {
    background: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=range]:disabled::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.2);
}

.text > #text-content > #main input[type=range]:disabled::-webkit-slider-runnable-track {
    background: rgba(0, 0, 0, 0.2);
}

.text > #text-content > #main input[type=range]:disabled::-moz-range-track {
    background: rgba(0, 0, 0, 0.2);
}

.text > #text-content > #main input[type=range]::-ms-track {
    color: transparent;
    background-color: transparent;
}

.text > #text-content > #main input[type=range]::-ms-ticks-before,
.text > #text-content > #main input[type=range]::-ms-ticks-after {
    color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=text],
.text > #text-content > #main input[type=email],
.text > #text-content > #main input[type=number],
.text > #text-content > #main input[type=password],
.text > #text-content > #main input[type=search],
.text > #text-content > #main input[type=tel],
.text > #text-content > #main input[type=url] {
    color: #000000;
    background-color: rgba(255, 255, 255, 0.4);
    border-color: rgba(0, 0, 0, 0.4);
}

.text > #text-content > #main input[type=text]:-ms-input-placeholder,
.text > #text-content > #main input[type=email]:-ms-input-placeholder,
.text > #text-content > #main input[type=number]:-ms-input-placeholder,
.text > #text-content > #main input[type=password]:-ms-input-placeholder,
.text > #text-content > #main input[type=search]:-ms-input-placeholder,
.text > #text-content > #main input[type=tel]:-ms-input-placeholder,
.text > #text-content > #main input[type=url]:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=text]::-webkit-input-placeholder,
.text > #text-content > #main input[type=email]::-webkit-input-placeholder,
.text > #text-content > #main input[type=number]::-webkit-input-placeholder,
.text > #text-content > #main input[type=password]::-webkit-input-placeholder,
.text > #text-content > #main input[type=search]::-webkit-input-placeholder,
.text > #text-content > #main input[type=tel]::-webkit-input-placeholder,
.text > #text-content > #main input[type=url]::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=text]::-moz-input-placeholder,
.text > #text-content > #main input[type=email]::-moz-input-placeholder,
.text > #text-content > #main input[type=number]::-moz-input-placeholder,
.text > #text-content > #main input[type=password]::-moz-input-placeholder,
.text > #text-content > #main input[type=search]::-moz-input-placeholder,
.text > #text-content > #main input[type=tel]::-moz-input-placeholder,
.text > #text-content > #main input[type=url]::-moz-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=text]:hover,
.text > #text-content > #main input[type=email]:hover,
.text > #text-content > #main input[type=number]:hover,
.text > #text-content > #main input[type=password]:hover,
.text > #text-content > #main input[type=search]:hover,
.text > #text-content > #main input[type=tel]:hover,
.text > #text-content > #main input[type=url]:hover {
    background-color: rgba(255, 255, 255, 0.6);
    border-color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=text]:focus,
.text > #text-content > #main input[type=email]:focus,
.text > #text-content > #main input[type=number]:focus,
.text > #text-content > #main input[type=password]:focus,
.text > #text-content > #main input[type=search]:focus,
.text > #text-content > #main input[type=tel]:focus,
.text > #text-content > #main input[type=url]:focus {
    color: #000000;
    background-color: #ffffff;
}

.text > #text-content > #main input[type=text]::-ms-clear,
.text > #text-content > #main input[type=email]::-ms-clear,
.text > #text-content > #main input[type=number]::-ms-clear,
.text > #text-content > #main input[type=password]::-ms-clear,
.text > #text-content > #main input[type=search]::-ms-clear,
.text > #text-content > #main input[type=tel]::-ms-clear,
.text > #text-content > #main input[type=url]::-ms-clear {
    display: block;
    color: rgba(0, 0, 0, 0.6);
}

.text > #text-content > #main input[type=text]::-ms-clear:active,
.text > #text-content > #main input[type=email]::-ms-clear:active,
.text > #text-content > #main input[type=number]::-ms-clear:active,
.text > #text-content > #main input[type=password]::-ms-clear:active,
.text > #text-content > #main input[type=search]::-ms-clear:active,
.text > #text-content > #main input[type=tel]::-ms-clear:active,
.text > #text-content > #main input[type=url]::-ms-clear:active {
    color: #ffffff;
}

@media (min-width: 992px) and (max-width: 1340px) {
    .text > #text-content > #title {
        font-size: 2.84rem !important;
    }

    .text > #text-content > #author {
        font-size: 1.15rem !important;
    }

    .text > #text-content > #publish-date {
        font-size: 1.15rem !important;
    }

    .text > #text-content > #main h1 {
        font-size: 2.85rem !important;;
    }

    .text > #text-content > #main h2 {
        font-size: 2.15rem !important;
    }

    .text > #text-content > #main h3 {
        font-size: 1.5rem !important;
    }

    .text > #text-content > #main h4 {
        font-size: 1.25rem !important;
    }

    .text > #text-content > #main h5 {
        font-size: 1.1rem !important;
    }

    .text > #text-content > #main * {
        font-size: 1.1rem !important;
    }

    .dynamics #dynamics-list .dynamics-content {
        font-size: 1rem !important;
    }
}

@media (max-width: 992px) {
    .first-row .mif-arrow-left {
        font-size: 6.65rem !important;
    }

    .first-row #title {
        font-size: 6.65rem !important;
    }

    .text > #text-content > #title {
        font-size: 6.65rem !important;
    }

    .text > #text-content > #author {
        font-size: 2.55rem !important;
    }

    .text > #text-content > #publish-date {
        font-size: 2.55rem !important;
    }

    .text > #text-content > #main *:nth-child(1) {
        margin: 0;
    }

    .text > #text-content > #main * {
        font-size: 2.5rem !important;
    }

    .text > #text-content > #main h1 {
        font-size: 6.66rem !important;
    }

    .text > #text-content > #main h2 {
        font-size: 5.0rem !important;
    }

    .text > #text-content > #main h3 {
        font-size: 3.5rem !important;
    }

    .text > #text-content > #main h4 {
        font-size: 3.0rem !important;
    }

    .text > #text-content > #main h5 {
        font-size: 2.5rem !important;
    }

    .text > #text-content > #form > .win-button {
        font-size: 2.5rem !important;
        min-height: 53px;
        min-width: 200px;
    }

    .dynamics #dynamics-list .dynamics-content > .dtitle,
    .dynamics #dynamics-list .dynamics-content > .dauthor,
    .dynamics #dynamics-list .dynamics-content > .ddate {
        font-size: 2.0rem;
    }
}