/* -------------- Pytorch demystified 1: Tensor interface and Python bindings ---------------- */

.pytorch-step-row-reverse {
    flex-direction: row-reverse;
}

.pytorch-step-heading {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
}

.pytorch-step-heading-mobile {
    display: none;
}

#pytorch-trends-in-ml,
#pytorch-trends-in-ml-dark {
    width: 75%;
}

#pytorch-class-diagram,
#pytorch-class-diagram-dark {
    width: 64%;
}

#pytorch-boost-python-schematic,
#pytorch-boost-python-schematic-dark {
    width: 70%;
}

.pytorch-module-table-wrap {
    margin: 32px 0;
}

.pytorch-module-table {
    table-layout: fixed;
}

.pytorch-module-table th,
.pytorch-module-table td {
    width: 25%;
    white-space: normal;
    word-break: break-word;
}

@media (hover: none) and (pointer: coarse) and (orientation: portrait) {
    .pytorch-module-table thead {
        display: none;
    }

    .pytorch-module-table,
    .pytorch-module-table tbody,
    .pytorch-module-table tr,
    .pytorch-module-table td {
        display: block;
        width: 100%;
    }

    .pytorch-module-table td {
        text-align: left;
    }

    .pytorch-module-table td::before {
        content: attr(data-label);
        display: block;
        font-weight: 600;
        margin-bottom: 4px;
    }

    .pytorch-step-row-reverse {
        flex-direction: column;
    }

    .pytorch-step-heading {
        display: none;
    }

    .pytorch-step-heading-mobile {
        display: inline;
    }

    #pytorch-trends-in-ml,
    #pytorch-trends-in-ml-dark {
        width: 90%;
    }

    #pytorch-class-diagram,
    #pytorch-class-diagram-dark {
        width: 90%;
    }

    #pytorch-boost-python-schematic,
    #pytorch-boost-python-schematic-dark {
        width: 100%;
    }
}