/* styles for the wolfram.com mathematica personal edition.
   requires: /common/framework/css/framework.zh.css
   ========================================================================== */
html {
    font-family: 'Microsoft YaHei', 'Hiragino Sans GB', Arial, sans-serif;
}
main a {
    color: #777777;
}
main a:focus,
main a:hover {
    color: #ff6c00;
}
main#resources {
    display: block;
    margin: 0;
    overflow: hidden;
}
h2 {
    color: #f71900;
    font-size: 1.76rem;
    font-weight: 300;
    margin-bottom: 2.7rem;
}
.page-width {
    border-bottom: none;
    margin: 0 auto;
    max-width: 64.0rem;
    padding: 0 1rem;
    width: 100%;
}
/* ==========================================================================
   pricing
   ========================================================================== */
.price-wrapper {
    -webkit-transition: opacity 1s;
    color: #222;
    opacity: 0;
    transition: opacity 1s;
}
.price-tag {
    font-size: 2.125rem;
    vertical-align: baseline;
}
.dollarsign {
    display: inline-block;
    font-size: 1.25rem;
    line-height: 1;
}
.slash {
    display: inline-block;
    margin: 0 2px;
}


.vat-note strong {
    font-size: .8rem;
}

.vat {
    font-size: .625rem;
    margin-left: 2px;
}
.type,
.qual,
.plus,
.round,
.use,
.serv,
.addserv {
    display: none;
}
hr {
    border-bottom: 0;
    border-color: #5454;
    margin-bottom: 1rem;
}
/* ==========================================================================
   Slideshow
   ========================================================================== */
.mySlides {
    display: none;
}
/* Slideshow container */
.slideshow-container {
    max-width: 1102px;
    position: relative;
    margin: auto;
}
.mySlides img {
    width: 100%;
    height: auto;
}
.right-box {
    bottom: 0;
    position: absolute;
    right: 5%;
}
/* The dots/bullets/indicators */
.dot {
    background-color: #e58083;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    height: 1rem;
    margin: 0 .125rem .5rem .125rem;
    transition: background-color 0.6s ease;
    width: 1rem;
}
.active {
    background-color: #fff;
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
    .text {
        font-size: 11px
    }
}
/* ==========================================================================
   Headers
   ========================================================================== */
#section-header {
    background: #cc0003 none repeat scroll 0 0;
    line-height: 0;
    max-height: 23rem;
    position: relative;
    text-align: center;
    width: 100%;
}
#section-header img {
    max-height: 23rem;
}
#mobile-header {
    display: none;
}
.sub-header {
    color: #f71900;
    font-size: 1.76rem;
    font-weight: 300;
    margin: 3.125rem 0 2.7rem 0;
}
/* ==========================================================================
   Body
   ========================================================================== */
#top {
    padding: 3.125rem 0 2.7rem 0;
}
#top-long p {
    color: #545454;
    line-height: 2.25rem;
    font-size: 1.12rem;
    font-weight: 300;
    margin-bottom: inherit;
}
.top-small a {
    color: #dd1100;
}
.top-small a:hover {
    color: #ff6e00;
}
.button-wrapper {
    border-top: 26px solid #fff;
}
.price-tag.euro+button+.button-wrapper {
    border-top: none;
}
span.description.block {}
.button {
    background: #dd1100 none repeat scroll 0 0;
    border-radius: 3px;
    border: none;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 400;
    height: 3.25rem;
    left: 0;
    line-height: 3.25rem;
    position: absolute;
    text-align: center;
    top: .3rem;
    vertical-align: middle;
    width: 6.875rem;
}
.button:hover {
    background: #f75d00 none repeat scroll 0 0;
    color: #fff;
}
.price {
    color: #545454;
    display: inline-block;
    font-size: 0.7875rem;
    font-weight: 400;
    line-height: 1.2rem;
    padding: 0 0 .5rem 8.5rem;
    position: relative;
    vertical-align: middle;
}
.price .price {
    padding: 0 0 .2rem;
}
.price-tag.euro .vat {
    font-size: 0.8rem;
    margin-left: 0.5rem;
}
.price span {
    color: #dd1100;
    font-size: 1.28rem;
    font-weight: 300;
    vertical-align: baseline;
}
.price span.description {
    color: #545454;
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
}
.load-wrapper {
    display: none;
}
.customer {
    color: #545454;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.2rem;
}
#renewal-price .price,
#renewal-price .dollarsign {
    color: #545454;
    font-size: 0.6875rem;
    line-height: 2.0;
    padding: 0.5rem 0 0.2rem;
}
.link-only {
    display: block;
    margin-top: 0 !important;
    white-space: nowrap;
}
.link-only .dollarsign {
    margin-top: 0.22rem !important;
}
.link-only .price, .link-only .price-tag {
    color: #777;
    font-size: 0.8rem;
    font-weight: 400;
}
section .spacing-3 {
    color: #545454;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5rem;
}
section .spacing-3:nth-child(3n) {
    padding: 0 0 2.5rem 3rem;
}
section .spacing-3:nth-child(3n+1) {
    padding: 0 3rem 2.5rem 0;
}
section .spacing-3:nth-child(3n+2) {
    padding: 0 1.5rem 2.5rem 1.5rem;
}
/* why wolfram */
#why-wolfram {
    padding: 3.125rem 0 2.7rem 0;
    background-color: #f1fafe;
}
/* reasons */
.reasons {
    color: #545454;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.6rem;
    max-width: 27rem;
}
div>.reasons {
    margin: 2rem 0;
}
div>.reasons:first-of-type {
    margin-top: 0;
}
.reasons span {
    color: #f76300;
    display: block;
    font-size: 0.9875rem;
    font-weight: 600;
    line-height: 1rem;
    margin-bottom: .25rem;
}
.reasons a {
    color: #dd1100;
}
.reasons a:hover {
    color: #ff6c00;
}
.thumbnails a {
    color: #df5213;
    font-weight: 600;
    font-size: .9875rem;
    line-height: 1.35;
}
#resources section .thumbnail {
    margin: 0 0 5.0rem;
    text-align: center !important;
}
#resources section .thumbnail span {
    color: #535353;
    display: block;
    font-weight: 600;
}
.col-space1 {
    margin-top: -50px;
}
.col-space2 {
    margin-top: -30px;
}
section .grid.cols-3 .thumbnail:nth-child(3n) {
    text-align: right;
}
#resources section .thumbnails img {
    display: block;
    margin: 0 auto 1.2rem auto;
    max-width: 20rem;
}
#bottom {
    padding: 3.125rem 1rem 2.7rem;
}
.long-text {
    color: #545454;
    font-size: 1rem;
    font-weight: 300;
    font-weight: 30px;
    line-height: 1.65rem;
    margin-bottom: 1.875rem;
}

/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */
/* styles for large screens (1200px)
   ========================================================================== */
@media all and (max-width: 1200px) {
    .price {
        padding: 0 0 .5rem 7.6rem;
    }
    span.description.block {
        display: block
    }
}
/* styles for large screens (900px)
   ========================================================================== */
@media all and (max-width: 900px) {
    section .spacing-3 span {
        display: block;
        max-width: 20rem;
    }
    #resources section .thumbnails img {
        margin: 0 0 1.2rem 0;
    }
    section .spacing-3:nth-child(2n) {
        padding: 0 0 2.5rem 0;
    }
    section .spacing-3:nth-child(2n+1) {
        padding: 0 0 2.5rem 0;
    }
    .price {
        padding: 4rem 0 .5rem 0;
    }
    .customer {
        font-size: 0.6875rem;
    }
    .small_hr {
        border-bottom: 1px solid;
        border-color: #5454;
    }
}
/* styles for small screens (600px)
   ========================================================================== */
@media screen and (max-width: 600px) {
    .page-width {
        max-width: 29rem
    }
    #mobile-header {
        height: 13rem;
        line-height: .98;
    }
    h2 {
        text-align: center;
    }
    #resources section .thumbnails {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    #resources section .thumbnails img {
        height: auto;
        margin: 0 auto;
        max-width: 250px;
        width: 100%;
    }
    section .spacing-3 span {
        max-width: 300px;
        margin: auto;
        text-align: center;
        padding-top: .5rem
    }
    .thumbnails>div,
    .thumbnails>div a {
        width: 100% !important;
    }
    section .spacing-3:nth-child(3n) {
        padding: 0 0 2.5rem 0;
    }
    section .spacing-3:nth-child(3n+1) {
        padding: 0 0 2.5rem 0;
    }
    section .spacing-3:nth-child(3n+2) {
        padding: 0 0 2.5rem 0;
    }
    #top-small {
        width: 100% !important;
        height: 90px;
    }
    .width-full__600,
    .heirs-width-full__600>* {
        width: 90% !important;
    }
    .long-text {
        width: 90% !important;
    }
    .slideshow-container {
        display: none;
    }
    .dot {
        display: none;
    }
    #mobile-header {
        color: #fff;
        display: block;
        font-size: 3rem;
        line-height: 1.0;
        margin: 0 auto;
        max-width: 18rem;
        padding-top: 1.5rem;
        text-align: left;
        text-transform: uppercase;
    }
    .description-block {
        margin-top: 2rem;
    }
    .price {
        font-size: 0.8125rem;
        padding: 0 1rem .5rem 7.5rem;
    }
    .small_hr {
        border-right: 1px solid;
        border-color: #5454;
        max-width: 58%;
    }
    .price span.description {
        font-size: 0.8125rem;
    }
    .price-wrapper {
        height: 1.75rem;
    }
    #mobile-header span {
        display: inline-block;
        font-size: 2.0rem;
        font-weight: 300;
    }
    .small_hr {
        border-bottom: 0;
    }
    .customer {
        display: inline-block;
        font-size: 0.8125rem;
        padding: 0 0 0 1rem;
    }
}
/* styles for minimum supported screen width (320px)
   ========================================================================== */
@media all and (max-width: 320px) {}
/* printer styles
   ========================================================================== */
@media print {}