/*
Theme Name: Wolfram Support
Theme URI: http://www.wolfram.com
Author: WRI
Author URI: http://www.wolfram.com
Description: Wolfram Support
Tags: wri

   developer:   rmiske
   requires:    /common/framework/css/framework.en.css
   ========================================================================== */



/* ==========================================================================
   setup the environment
   ========================================================================== */
html { font-family: 'Source Sans Pro', Arial, sans-serif; }
body { color: #535353; }

div[id$="-content"] p,
div[id$="-content"] li,
.cta-link,
#subtopics a {
    font-size: 0.9375rem;
    line-height: 1.5333333333rem;
}
div[id$="-content"] p {
    margin: 0 0 1rem;
}
div[id$="-content"] p.subtitle {
    font-size: 1.3125rem;
    font-weight: 300;
}
noscript p {
    line-height: 1 !important;
    margin: initial !important;
}
div[id$="-content"] p:empty { display: none; /*WP extras*/ }


/**/
.hide { display: none; }
.orange { color: #f57721 !important; }


/*lists*/
#call-us-inner ul > li,
#post-content ul > li {
    line-height: 1.5;
    margin-left: 0.75rem;
    margin-bottom: 0.25rem;
}
#call-us-inner ul > li:before,
#post-content ul > li:before {
    color: #dd1100;
    content: "\25A0";
    display: inline-block;
    font-family: Arial;
    font-size: 0.6875rem;
    margin-left: -0.75rem;
    margin-right: 0;
    position: relative;
    top: -0.125rem;
    width: 0.75rem; 
}
#post-content ol > li {
    display: list-item;
    line-height: 1.5;
    list-style: decimal;
    margin-bottom: 0 !important;
    margin-left: 1.5rem;
    padding-bottom: 2rem !important;
}
#post-content ul ol > li { list-style: decimal; }
#post-content ol ol > li { list-style: lower-alpha; }
#post-content ol ol > li:last-child { padding-bottom: 1rem !important; }


/*misc*/
.cta-link { margin-top: 0.75rem; }
.cta-link span { padding-right: 0.625rem; }
code, kbd, pre, samp, tt { font-family: 'Source Code Pro', Consolas, Monaco, monospace; }
img.border { border: 1px solid #ddd !important; }



/* ==========================================================================
   sections
   ========================================================================== */
section, 
header#home,
header#sub,
header#search {
    padding: 2rem 0.78125rem; /*12.5px*/
    width: 100%;
}
div[id$="-content"],
#products-lg h2 {
    margin: 0 auto;
    max-width: 64.3125rem; /*(1029px)*/
    padding: 0 0.78125rem; /*12.5px*/
    width: 100%;
}
div[id$="-content"] h1 {
    font-size: 2.8125rem;
    text-transform: uppercase;
}
div[id$="-content"] h2,
#products-lg h2,
#post-content h1 {
    font-size: 1.6875rem;
    font-weight: 300;
    line-height: 1;
    margin-top: 0;
    margin-bottom: 1rem;
    text-transform: none;
}
div[id$="-content"] h3 {
    color: #333;
    font-size: 1.125rem;
    margin-bottom: 1rem;
}
div[id$="-content"] h4 {
    color: #333;
    font-size: 1rem;
    margin-bottom: 1rem;
}
div[id$="-content"] img,
div[id$="-content"] iframe {
    max-width: 100%;
}



/* ==========================================================================
   head
   ========================================================================== */
#home-content,
#sub-content,
#search-content { 
    position: relative; 
}
#login {
    background: #d00;
    line-height: 1;
    margin-right: 0.78125rem; /*12.5px*/
    margin-top: 0;
    padding: 0.5rem 0.75rem;
    position: absolute;
    right: 0;
    top: -2rem;
}
#login:hover { background: #fe0000; }
#login span { padding: 0; }
#login span:first-child { 
    padding-right: 0.25rem; 
    position: relative;
    top: 1px;
}
.backlink { font-size: 0.9375rem; }
.category .backlink, .search .backlink { font-size: 1.0625rem; line-height: 1.25rem; padding-bottom: 0.125rem; }

/*home*/
#home h1 { padding: 2rem 0 1.75rem; }
#home input {
    border: 2px solid #f57221; 
    border-radius: 5px; 
    color: #535353; 
    font-size: 1.3125rem !important;
    font-weight: 300;
    padding: 0.5rem 0.75rem 0.75rem;
    width: 100%;
}
#home input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #a9a9a9;
    opacity: 1; /* Firefox */
}
#home input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #a9a9a9;
}
#home input::-ms-input-placeholder { /* Microsoft Edge */
    color: #a9a9a9;
}

/*subpages/search*/
header#sub, header#search { padding-bottom: 0; padding-top: 2.75rem; }
#sub h1, #search h1 { padding: 0 0 1.25rem; }
.category #sub #login, .search #search #login { top: -2.75rem; }

/* ==========================================================================
   notification
   ========================================================================== */
#notice {
    padding: 0 0.78125rem 2rem 0;
}

#notice-content {
    background: #fffeec;
    border: 2px solid #FEF4BC;
    padding: 1rem 1rem 0 1.5rem;
}
/* ==========================================================================
   product tiles
   ========================================================================== */
.product-tiles { 
    padding-bottom: 0; 
    padding-top: 0; 
}
.product-tiles > div { 
    display: flex;
    padding: 0 !important; 
}
.product-tiles .grid { }
.product-tiles .grid .inner {
    border: 1px solid #b3b3b3;
    border-radius: 5px;
    display: block;
    margin: 0.625rem 0.78125rem; /*10px 12.5px*/
    text-transform: uppercase;
}

#products-lg-content { font-size: 1.125rem; }
#products-lg-content .grid .inner { padding: 2rem 0.5rem; }
#products-lg-content .grid .inner.two-line { padding-bottom: 1rem; }
#products-lg-content .two-line div { 
    line-height: 1.25rem; 
    margin-top: -0.0625rem;
}
#products-lg-content .two-line div span {
    display: block;
    font-size: 0.875rem;
}

#products-sm { margin-bottom: 0.5rem; }
#products-sm-content { font-size: 0.9375rem; }
#products-sm-content .grid .inner { padding: 1.375rem 0.5rem; }



/* ==========================================================================
   other sections
   ========================================================================== */
#rec-related, #community { padding-bottom: 0.25rem; }
#rec-related .two-col,
#community .two-col { 
    column-count: 2;
    column-gap: 2rem;
}
.two-col a,
.two-col div {
    break-inside: avoid;
    font-size: 0.9375rem;
    line-height: 1.533333rem;
    margin-bottom: 0.8125rem;
    padding-right: 10%;
}
#community p.subtitle { 
    padding-top: 0.25rem; 
    margin-bottom: 2.25rem;
}
#tech-services { padding-bottom: 4.5rem; }

.single #rec-related .chevron-after:after,
#rec-related .two-col .chevron-after:after,
#community .two-col .chevron-after:after { 
    color: #d00; 
}



/* ==========================================================================
   back to top
   ========================================================================== */
a.toplink {
    bottom: 2rem;
    color: #ccc;
    display: none;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 1.07rem;
    line-height: 1;
    position: fixed;
    right: 3.125rem;
    text-align: center;
    width: 25px;
}
a.toplink:before {
    background-image: url('/wp-content/themes/support/img/icon-back-to-top.png');
    background-size: 11px 15px;
    content: '';
    display: inline-block;
    height: 15px;
    position: relative;
    top: -5px;
    width: 11px;
    z-index: 10;
}
a.toplink:after {
    background: #cbcbcb;
    border-radius: 3px;
    content: '';
    display: block;
    height: 25px;
    position: absolute;
    top: -10px;
    width: 25px;
}
a.toplink:hover:after { background: #f77700; }
a.toplink.above-footer {
    opacity: 0;
    transition: all .3s ease-out;
}



/* ==========================================================================
   language picker
   ========================================================================== */
#language-picker { padding-bottom: 1.875rem; padding-top: 1.25rem; }
#language-picker-content { text-align: right; }
#language-picker-form { display: inline-block; vertical-align: middle; }
#language-picker-select {
    color: #666;
    height: 32px;
    line-height: 1;
    margin: 0 0 0 .25rem;
    min-width: 10.5em;
    padding: 0 0 2px 0;
}



/* ==========================================================================
   contact
   ========================================================================== */
#contact-support { background: #f0f0f0; }
#contact-support-content .mini-m { cursor: pointer; }
#contact-support-content .mini-m img {
    position: relative;
    top: 0.1875rem;
}
#call-us-content { 
    display: none; 
    padding: 0;
}
#call-us-content h2.red {
    font-size: 1.5625rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}
#call-us-content h2.red small { font-size: 1rem; }
#call-us-content .grid h2 {
    font-size: 1.3125rem;
    font-weight: 400;
    margin-bottom: 0.25rem;
}
#call-us-inner { 
    border-top: 1px solid #b3b3b3; 
    margin-top: 30px; 
    padding: 1.875rem 0;
    position: relative;
}
#call-us-inner .grid div {  padding-right: 2rem; }
#call-us-inner .grid p { margin-bottom: 0.75rem; }


/*triangles*/
#call-us-inner:before,
#call-us-inner:after {
    border-style: solid;
    content: '';
    display: block;
    height: 0;
    position: absolute;
    width: 0;
}


/*outer border*/
#call-us-inner:before {
    border-color: transparent transparent #b3b3b3 transparent;
    border-width: 19px;
    left: calc(66.666667% + 1.875rem);
    top: -38px;
}


/*inner fill*/
#call-us-inner:after {
    border-color: transparent transparent #f0f0f0 transparent;
    border-width: 18px;
    left: calc(66.666667% + 1.875rem + 1px);
    top: -36px;
}



/* ==========================================================================
   rules
   ========================================================================== */
hr {
    border: 0;
    border-top: 1px solid #b3b3b3;
    height: 0;
}
header#home hr { 
    margin-bottom: 0.875rem;
    margin-top: 3.125rem; 
}
section hr { margin-bottom: 3rem; }



/* ==========================================================================
   topic pages
   ========================================================================== */
#subtopics {  }
#subtopics a {
    border: 1px solid #d0d0d0;
    border-radius: 0.25rem;
    color: #6f6f6f;
    display: inline-block;
    line-height: 1;
    margin-bottom: 0.625rem;
    margin-right: 0.625rem;
    padding: 0.4375rem 0.625rem;
}
#subtopics a:hover {
    border-color: #f77700;
    color: #f77700;
}
#subtopics a.active-item { 
    background: #dd1100; 
    border-color: #dd1100;
    color: #fff;
}

section#topics { padding-bottom: 0; padding-top: 0.625rem; }

#topics-content li {
    font-size: 1.3125rem;
    line-height: 1.2;
    padding-bottom: 1.625rem;
}

.more-link span, .less-link span { cursor: pointer; }
.more-link .triangle {
    content: "";
    border-color: transparent transparent transparent #dd1100;
    border-style: solid;
    border-width: 0.375rem 0 0.375rem 0.65rem;
    display: inline-block;
    margin-left: 0.25rem;
    height: 0;
    width: 0;
}
.more-link span:hover .triangle { border-left-color: #f57721; }
.less-link .triangle {
    content: "";
    border-color: transparent transparent #dd1100 transparent;
    border-style: solid;
    border-width: 0 0.375rem 0.65rem 0.375rem;
    display: inline-block;
    margin-left: 0.25rem;
    height: 0;
    width: 0;
}
.less-link span:hover .triangle { border-bottom-color: #f57721; }


/*search*/
.category-search { }
.category-search .search { margin-left: 0.5rem; line-height: 0; }
.category-search .search-icon { 
    border-left: 1px solid #ddd; 
    cursor: pointer;
    padding: 0.125rem 0.375rem 0 0.5rem; 
}
.category-search .search-input { 
    display: none;
    max-width: 20.625rem;
    width: 20.625rem;
}
.category-search .search-input.active { display: table-cell; }
.category-search input { 
    border: none; 
    border-bottom: 1px solid #ddd;
    font-size: 0.8125rem !important;
    line-height: 1;
    padding: 1px 0;
    width: 20.625rem;
}
.category-search input::placeholder { color: #a9a9a9; /*all*/ opacity: 1; /*Firefox*/ } /*Chrome, Firefox, Opera, Safari 10.1+*/
.category-search input:-ms-input-placeholder { color: #a9a9a9; } /*Internet Explorer 10-11*/
.category-search input::-ms-input-placeholder { color: #a9a9a9; } /*Microsoft Edge*/


/*new product info*/
#new-product-info {
    background: #ececec;
    padding: 0.9375rem 0.9375rem 0.75rem;
    margin-bottom: 1.875rem;
}
#new-product-info div, #new-product-info h2 { line-height: 2.25rem; }
#new-product-info .prod-links div { padding-left: 3.4375rem; }
#new-product-info .prod-head div { line-height: 1; padding-right: 0.625rem; }
#new-product-info h2 {
    font-size: 1.3125rem;
    font-weight: 400;
    margin-bottom: 0 !important;
}
#new-product-info p { display: none; /*thanks wp*/ }


/* additional resources */
section#resources { padding-top: 1.5rem; }
#resources-content h2 { margin-bottom: 1rem; }
#resources .grid { margin-bottom: 1.5rem; }
#resources-content .grid a h3 { color: #dd1100; }
#resources-content .grid a:hover h3 { color: #f77700; }
.rsrc-icon { width: 3.75rem; }
.rsrc-icon img { height: auto; margin: 0.25rem 0.625rem 0 0; max-width: 3.125rem !important; }
.rsrc-text, .rsrc-text-common { padding-bottom: 0.125rem; padding-right: 4rem; }
.rsrc-text h3 { margin-bottom: 0 !important; }
#resources-content .grid a .rsrc-text p.chevron-after:after { color: #dd1100; }
#resources .grid p:empty, #resources .grid div p:last-child { display: none; /*WP extras*/ }
#resources-content .grid a .rsrc-text-common p.chevron-after { color: #dd1100; display: block; }
#resources-content .grid a:hover .rsrc-text-common p.chevron-after { color: #f77700; }
.rsrc-text-common p:first-child { margin-bottom: 0.25rem; margin-top: -0.125rem; }



/* ==========================================================================
   search results
   ========================================================================== */
.search #topics-content li * { display: block; } 
.search #topics-content li span.excerpt {
    font-size: 1rem;
    padding-top: 0.25rem;
} 
.search-nav { padding-bottom: 4rem; font-size: 1.4rem; }


/* ==========================================================================
   single posts
   ========================================================================== */
.single-post header#sub { padding-bottom: 1rem; padding-top: 3.125rem; }
section#post { padding-top: 0; }
.single-post #sub-content h1,
#post-content #entry, 
#helpful-form-content form { 
    max-width: 41.25rem; /*660px*/ 
    width: 100%; 
}
.single-post #sub-content h1 {
    font-size: 1.6875rem;
    line-height: 2rem;
    padding-bottom: 0;
    padding-top: 0.375rem;
    text-transform: none;
}
#post-content h2 {
    color: #f57721;
    font-size: 1.375rem;
    margin-top: 3rem;
}
#post-content h2:first-child {
    margin-top: 0;
}
#post-content a { color: #d00; }
#post-content a:hover { color: #f77700; }
#post-content p {

}
#post-content li { padding-bottom: 0.5rem; }
#post-content ul li p, #post-content ul li table { margin-left: 0.25rem !important; }
#post-content img { height: auto; width: initial; }
#post-content li img { margin: 1rem 0 0; }
#post-content li img:last-child, #post-content li p:last-child { margin-bottom: 0; }
#post-content img + .caption, 
#post-content p:empty + .caption {
    font-size: 0.8125rem;
    line-height: 1.0625rem;
    margin-top: -1rem;
}


/* notes, code blocks */
.warning, .warning-text, pre {
    font-size: 0.8125rem;
    line-height: 1.1875rem;
}
.warning, pre {
    margin: 1.875rem 0 1.5rem 0;
    padding: 1.25rem 1.875rem;
}
.warning {
    background: #fffeec;
    border: 1px solid #fe9;
}
.warning-text { margin-left: 0 !important; }
pre { background: #f5f5f5; color: #000; }
.warning:last-child, pre:last-child { margin-bottom: 0; }
p:not(:empty) + .warning, p:not(:empty) + pre { margin: 1.625rem 0 1.5rem; }
/*div > pre { margin: 0 0 0 calc(-1em - 2px); }*/


/*tables*/
#post-content table,
#post-content table.tableizer-table {
    border: 1px solid #ddd;
    font-family: inherit;
    font-size: 0.9375rem;
    margin: 1rem 0 0.5rem;
}
#post-content p:not(:empty) + table { margin-top: 0 !important; }
#post-content table th,
#post-content .tableizer-table th,
#post-content table td,
#post-content .tableizer-table td {
    border: 1px solid #ddd;
    margin: 0;
    padding: 0.75rem 0.9375rem;
    text-align: center;
}
#post-content  table th,
#post-content .tableizer-table th {
    background-color: #f5f5f5;
    color: #dd1100;
    font-weight: 600;
}
.single-post #rec-related { padding-bottom: 4.5rem; }


/*related*/
.single-post #rec-related .grid div { padding-bottom: 0.875rem; }
.single-post #rec-related .grid div:last-child { padding-bottom: 0; }



/* ==========================================================================
   feedback form
   ========================================================================== */
section#helpful { 
    padding-bottom: 0.625rem; 
    padding-top: 0.5rem; 
}

.isHelpfulTitle {
    display: inline-block; 
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.5rem;
    margin-right: 0.3125rem;
}
#helpful .button,
#helpful-form .button {
    background: #fff;
    border: 1px solid #dd1100;
    border-radius: 0.25rem;
    color: #dd1100;
    cursor: pointer;
    display: inline-block;
    font-size: 0.8175rem;
    line-height: 1.5rem;
    margin-left: 0.4375rem;
    padding: 0 0.9375rem;
}
#helpful .button:hover,
#helpful-form .button:hover,
#helpful .button.active,
#helpful-form .button.active {
    background: #dd1100;
    color: #fff;
}

section#helpful-form {
    background: #f0f0f0;
    display: none;
    font-size: 0.9375rem;
    margin: 0.625rem 0 1rem;
    padding-bottom: 1.875rem;
    padding-top: 1.375rem;
}
#helpful-form-content { position: relative; }
#helpful-form textarea {
    display: block;
    font-size: 0.9375rem !important;
    height: 8rem;   
    padding: 0.25rem 0.5rem;
    margin: 0.5rem 0 1rem;
    width: 100%;
}
#helpful-form .button { margin-left: 0; margin-top: 0.25rem; }
#helpful-form #thanks { display: none; }

section#backlink { padding-top: 0; }

#commentsFormExit {
    cursor: pointer;
    display: inline-block;
    font-size: 2rem;
    height: 1.25rem;
    line-height: 1.25rem;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 1.25rem;
    z-index: 7;
}
#commentsFormExit:hover { color: #dd1100; }



/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */
@media (max-width: 1200px) {
}


@media (max-width: 900px) {
    section, 
    div[id$="-content"],
    #products-lg h2,
    #post-content h1 {
        padding-left: 0.53571428571rem; /*7.5px*/
        padding-right: 0.53571428571rem; /*7.5px*/
    }
    #login { margin-right: 0.53571428571rem; /*7.5px*/ }
    .product-tiles .grid .inner { margin: 0.53571428571rem; /*7.5px*/ }
    #new-product-info .prod-links div { padding-left: 3.14285714rem; /*44px*/ }
}


@media (max-width: 600px) {
    section, 
    div[id$="-content"],
    #products-lg h2,
    #post-content h1 {
        padding-left: 0.57692307692rem; /*7.5px*/
        padding-right: 0.57692307692rem; /*7.5px*/
    }
    #home #login { margin-right: 0.57692307692rem; /*7.5px*/ }
    div[id$="-content"] p,
    div[id$="-content"] li,
    .cta-link {
        font-size: 1rem;
    }
    .product-tiles .grid .inner { margin: 0.57692307692rem; /*7.5px*/ }
    #products-sm .grid .inner { border: none; }
    /*other sections*/
    #rec-related .two-col, #community .two-col { 
        column-count: 1;
        column-gap: 2rem;
    }
    #two-col a, #two-col div { padding-right: 0; }
    #new-product-info .prod-links div { padding-left: 3.38461538rem; /*44px*/ }
    /*category search*/
    .category-search .search { margin: 0.75rem 0 0.375rem; line-height: 0; }
    .category-search .search-icon { border: none; padding-left: 0; padding-top: 9px; }
    .category-search .search-input { display: table-cell; }
    .category-search input { font-size: 1.5rem !important; padding: 4px 0; }
    /*contact*/
    #contact-support, 
    #contact-support-content { 
        padding-left: 0; 
        padding-right: 0; 
    }
    #contact-pad,
    #call-us-inner {
        padding-left: 1.15384615385rem; /*15px*/
        padding-right: 1.15384615385rem; /*15px*/
    }
    #call-us-inner .grid div { padding-right: 0; }
    #call-us-inner .grid div:last-child { margin-top: 2.75rem; }
    #call-us-inner:before { left: 45px; }
    #call-us-inner:after { left: 46px; }
}


@media (max-width: 320px) {
    .category-search .search-icon img { max-width: none; }
    #new-product-info img { display: none; }
    #new-product-info .prod-links div { padding-left: 0; width: 100%; }
    .search-nav {
        font-size: 2rem;
        letter-spacing: 1rem;
    }
    .search-nav .text-align-r{
        text-align: center !important;
    }
}


@media print {}