/*==============================================
Common styles
================================================*/

.cloud_block {
    position: relative;
    padding-bottom: 2.1875rem;
}

.cloud_block.orange {
    background: #ef6000;
    overflow: hidden;
    margin: 0 0 3.125rem 0;
    padding-top: 2.185rem;
}

#cloud_body {
    color: #333;
    line-height: 1.5;
    background: #fff;
    font-family: 'Microsoft YaHei', 'Hiragino Sans GB', Arial, sans-serif;
}

#cloud_body h1 {
    font-weight: 500;
    font-size: 2.6875rem;
    margin: 4.6875rem 0 0;
    line-height: 1;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #fff;
    text-transform: none;
    margin: 0;
    margin-top: 1.78rem;
    padding-top: 1.125rem;
}

#cloud_body h2 {
    font-size: 1.0625rem
}

#cloud_body h2.orange {
    font-weight: 300;
    color: #f57300;
    font-size: 2.1875rem;
    margin-bottom: 0;
    margin-top: 1rem;
    float: left;
    line-height: 1.4;
}

#cloud_body h2.orange {
    font-weight: 300;
    color: #dd1600;
    font-size: 2.185rem;
    margin: 0.375rem 0 0 0
}

#cloud_body h2.blue {
    font-weight: 300;
    color: #1d96bd;
    font-size: 1.85rem;
    margin: 1.1875rem 0 0.25rem 0;
}

#cloud_body h5.orange,
#cloud_body h5.orange a {
    font-weight: 700;
    letter-spacing: 0.0625rem;
    text-transform: uppercase;
    color: #f57300 !important;
    font-size: 0.9375rem;
    margin: 2.1875rem 0 0 0;
}

#cloud_body h5.orange a:hover {
    color: #f71900 !important;
}

#cloud_body a {
    color: #dd1600;
}

#cloud_body a:hover {
    color: #f57300;
}

#cloud_body p.tagline {
    color: #3c3b3b;
    font-size: 1.3125rem;
    font-weight: 200;
    margin: 0.125rem auto 4.6875rem;
}

#cloud_body p {
    color: #656565;
    font-size: 0.9375rem;
    line-height: 1.9;
    font-weight: 400;
    margin-top: 0.3125rem;
}

.small_larger {
    font-size: 1rem !important;
}

.container {
    margin: 0 auto;
    width: 66.25rem;
    position: relative;
}

.cloud_container {
    width: 48.75rem !important;
    max-width: 100%;
}

.grey_rule {
    border-top: 1px solid #b7b7b7;
}

.halign_1 .twocol_one div,
.halign_1 .twocol_two div {
    min-height: 12rem;
}

.halign_2 .twocol_one div,
.halign_2 .twocol_two div {
    min-height: 11rem;
}

.halign_1,
.halign_2 {
    margin: 2.1875rem 0 0 0;
}

.halign_1 h5.orange,
.halign_2 h5.orange {
    margin: 0 !important;
}

/*==============================================
Wolfram Science
================================================*/

.larger {
    font-size: 1rem !important;
    line-height: 1.9 !important;
    margin-top: 0.435rem !important;
}

.newcloud_hero {
    border-bottom: none;
    width: 100%;
    background: #FFFFFF;
    background: -moz-linear-gradient(top, #FFFFFF 0%, #ececec 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #ececec));
    background: -webkit-linear-gradient(top, #FFFFFF 0%, #ececec 100%);
    background: -o-linear-gradient(top, #FFFFFF 0%, #ececec 100%);
    background: -ms-linear-gradient(top, #FFFFFF 0%, #ececec 100%);
    background: linear-gradient(to bottom, #FFFFFF 0%, #ececec 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#ececec', GradientType=0);
    overflow: visible;
    height: 11.82rem;
}

.newcloud_heading {
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

.trade {
    font-size: 0.9375rem;
    vertical-align: top;
    margin: .23rem 0 0 .1rem !important;
    display: inline-block;
    font-weight: 200;
    color: #c1c1c1 !important;
}

#cloud_body p.blue_smaller {
    font-weight: 300;
    color: #1d96bd;
    font-size: 1.3rem;
    line-height: 1.7;
    margin: 1.1875rem 0 0.5rem;
}

#cloud_body p.orange {
    font-weight: bold;
    letter-spacing: 0.0625rem;
    text-transform: uppercase;
    color: #f57300 !important;
    font-size: 0.83rem;
    margin: 2.1rem 0 0 0;
}

.newcloud_heading h1 {
    font-size: 2.125rem !important;
    text-transform: none !important;
    float: left;
    clear: both;
    color: #000000 !important;
    letter-spacing: normal !important;
    margin: 1.0625rem 0 0;
    font-weight: 600;
}

.newcloud_heading .tagline {
    font-size: 1.125rem !important;
    color: #656565 !important;
    margin-top: 0;
    line-height: 1.5rem;
    font-weight: 300 !important;
    letter-spacing: normal !important;
    clear: both;
}

.newcloud_heading p {
    color: #fff !important;
    font-weight: 600;
    letter-spacing: 0.0625rem;
    font-size: 0.75rem;
    line-height: 1.6;
}

.newcloud_heading a {
    float: left;
    padding: 0 0.5625rem 0 0.625rem;
    background: #1d96bd;
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3125rem 1.25rem 0.3125rem 1.25rem;
    color: #fff !important;
    letter-spacing: 0;
}

.newcloud_heading a:hover {
    background: #1284a9;
}

.chevron {
    color: #e00400;
}

.mining {
    padding-bottom: 0.9375rem;
}

/*==============================================
Two Columns
================================================*/

.two_column {
    display: flex;
    overflow: hidden;
}

.twocol_one,
.twocol_two {
    width: 23.125rem;
    float: left;
}

.twocol_one {
    margin-right: 4%;
}

.more-left {
    display: inline-block;
    float: left;
    margin: 1.875rem 0.625rem 0 0;
    width: 4.0625rem;
}

.more-left img {
    display: inline-block;
}

.more-right {
    width: 18.125rem;
    float: left;
    margin-bottom: 1.25rem;
    display: inline-block;
}

/*==============================================
History & Context
================================================*/

.cloud_block.grey_rule.history {
    background: #f2f2f2 !important;
}

/*==============================================
Related
================================================*/

.more-from-wolfram {
    color: #656565;
}

#cloud_body h4.more-from-wolfram {
    font-weight: 600;
    font-size: 1.25rem;
    margin: 2.5rem 0 0.25rem 0;
}

#cloud_body .more-from-wolfram-link:hover h5 {
    color: #f71900 !important;
}

/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */

/* styles for medium screens (1200px)
   ========================================================================== */

@media all and (max-width: 1200px) {
    .cloud_container {
        padding: 0 2.125rem !important;
    }
    .newcloud_hero {
        height: 13.82rem !important;
    }
    /* alignment */
    .halign_2 .twocol_one div,
    .halign_2 .twocol_two div {
        min-height: 11.43rem;
        margin-bottom: min(1.5rem);
    }
    .halign_1 .twocol_one div,
    .halign_1 .twocol_two div {
        margin-bottom: min(1.5rem);
    }
    .more-left {
        min-height: 5.3rem;
        display: flex;
        align-items: center;
    }
    #cloud_body h5.orange {
        margin: 1rem 0 0 0;
    }
    .more-right,
    .more-from-wolfram-link h5.orange {
        margin: 0 !important;
    }
    .wtones {
        min-height: 10rem !important;
        margin-bottom: min(1.875rem);
    }
}

/* styles for medium screens (900px)
   ========================================================================== */

@media all and (max-width: 900px) {
    /* keeping two_column divs aligned across */
    .halign_1 .twocol_one div,
    .halign_1 .twocol_two div {
        min-height: 13.9rem !important;
    }
    .halign_2 .twocol_one div,
    .halign_2 .twocol_two div {
        min-height: 12.9rem;
    }
    .wtones {
        min-height: 9rem !important;
        margin-bottom: min(2.187rem);
    }
    .roles {
        min-height: 11.3rem !important;
    }
    .history_context div,
    .bmargin div:nth-child(1) {
        margin-bottom: min(1.7rem);
    }
    .automating div:nth-child(1) {
        margin-bottom: min(1rem);
    }
    .twocol_one.automating div:nth-child(2) {
        margin-bottom: 3rem !important;
    }
}

/* styles for medium screens (600px)
   ========================================================================== */

@media all and (max-width: 600px) {
    #cloud_body p.tagline {
        margin: 0.125rem auto 0.689rem !important;
    }
    .newcloud_hero {
        height: auto !important;
    }
    html {
        min-width: 17.5rem !important;
    }
    .two_column {
        flex-wrap: wrap;
    }
    .more-right,
    .twocol_one,
    .twocol_two {
        width: 100% !important;
    }
    /* restoring alignment */
    .wtones,
    .roles,
    .halign_1 .twocol_one div,
    .halign_1 .twocol_two div,
    .halign_2 .twocol_one div,
    .halign_2 .twocol_two div {
        min-height: auto !important;
    }
    .halign_1 h5.orange,
    .halign_2 h5.orange {
        margin: 2.1875rem 0 0 0 !important;
    }
    .halign_1,
    .halign_2 {
        margin: 0;
    }
    .twocol_one {
        margin-right: 0%;
    }

    .roles,
    .wtones,
    .history_context div,
    .bmargin div:nth-child(1),
    .automating div:nth-child(1),
    .halign_1 .twocol_one div,
    .halign_1 .twocol_two div,
    .halign_2 .twocol_one div,
    .halign_2 .twocol_two div,
    .twocol_one.automating div:nth-child(2) {
        margin-bottom: auto !important;
    }
}

/* styles for medium screens (320px)
   ========================================================================== */

@media all and (max-width: 320px) {}