/* Wolfram Lightweight Grid Manager 
   URL: https://www.wolfram.com/lightweight-grid-manager/

   developer (updated by): tajudeen
   requires: framework.css.en
   ========================================================================== */

/* ==========================================================================
   Common Styles
   ========================================================================== */

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1.5;
    color: #222222;
}

#lightweightgrid #pageWrapper a, 
#lightweightgrid #pageWrapper a:link, 
#lightweightgrid #pageWrapper a:visited {
    color: #e00400;
    outline: none;
}

#lightweightgrid #pageWrapper a:active, 
#lightweightgrid #pageWrapper a:link:hover, 
#lightweightgrid #pageWrapper a:visited:hover {
    color: #d86c00;
}

#pageWrapper{
  display: flex;
  max-width: 60.5rem;
  margin: 0 auto;
  padding:0;
}

#topnav_wrap {
    max-width: 60.5rem;
    display: block;
    margin: 0 auto;
    padding: 2.5rem 0 0 0;
}

#main {
    max-width:36.875rem;
    margin: 0 auto;
}

.secondcol {
    width: 292px;
    display: inline-block;
    margin: 2.5rem 1.25rem 1.25rem auto;
    vertical-align: top;
}

#mainWrap {
    display: inline-block;
    margin: 1.25rem;
    flex: 1 1 auto;
}

#pageWrapper h1{
    font-size: 1.125rem;
    line-height: 1.22;
    margin-top: 1.875rem;
    color: #e00400;
    font-weight: bold;
    margin-bottom: 1.25rem;
}

#pageWrapper #main h4 {
    font-weight: bold;
}

/* ==========================================================================
   Intro
   ========================================================================== */

#pageWrapper #main h2 {
    font-weight: bold;
    font-size: 1rem;
    line-height: 1.43;
    font-family: Arial, Verdana, Geneva, sans-serif; 
    color: #000; 
    font-weight:bold;
}

#pageWrapper #main .intro {
    margin-top:4px;
    color: #666;
    font-size: 1rem;
    list-style: 1.32;
    font-family: Arial, Helvetica, sans-serif;
    margin-bottom: 2rem;
}

#pageWrapper #main .mgt {
    float: left;
}

#pageWrapper #mainWrap hr {
    margin-bottom: 0.3125rem !important;
}

#pageWrapper #main .leftimage .management {
    padding-top: 0.625rem;
}


/* ==========================================================================
   Learn More
   ========================================================================== */

#pageWrapper .learnmore {
    padding-top: 0.625rem;
    margin-left: 0.9375rem;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

#pageWrapper .learnmore img {
    float:left; 
    margin-right: 0.3125rem;
}

#pageWrapper .learnmore span {
    padding-top: 0.3125rem; 
    display:block;
}


/* ==========================================================================
   How it works
   ========================================================================== */

#pageWrapper .how {
    display: block;
    font-size: 1rem;
    color: #e00400;
    font-weight: bold;
    font-family: Helvetica, sans-serif;
    margin-bottom: 0.3125rem !important;
}

#pageWrapper .leftimage {
    float:left;
    border: none;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-right: 1.25rem;
}

#pageWrapper .leftimage.management {
    padding-top: 0.625rem;
}

#pageWrapper .contentright {
    border: none;
}

#pageWrapper .download h1 {
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   Download subpage
   ========================================================================== */
.download .sbpodContainer {
    margin: 0rem 2px 0rem 0rem;
    width: 100%;
}

.download #mainWrap {
    max-width: 45.9375rem;
    padding: 0.625rem 0 1.25rem 0;
}

.download #mainWrap .topHead h1 {
    margin-bottom: 0rem !important;
    margin-top: 0rem !important;
    padding: 1rem;
}

.download #mainWrap .topHead {
    border-bottom: 3px solid #ee3939;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.download #mainWrap .services {
    display: flex;
    justify-content: center;
    gap: 0.625rem 1.25rem;
}


/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */

/* styles for medium screens (1200px)
   ========================================================================== */

@media all and (max-width: 1200px) {
    #topnav_wrap {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

/* styles for medium screens (900px)
   ========================================================================== */

@media all and (max-width: 900px) {
    #pageWrapper {
        flex-direction: column;
        justify-content: flex-start;
    }
    
    #main {
        max-width: 100%;
    }

    .secondcol {
        margin: 0.625rem 0.625rem 2rem;
    }
}

/* styles for medium screens (600px)
   ========================================================================== */

@media all and (max-width: 600px) {
    #pageWrapper .leftimage {
        padding-right: 0.625rem;
    }

    #pageWrapper .learnmore {
        margin-top: 1rem;
    }

    /* Download subpage*/
    .download #mainWrap .services {
        flex-direction: column;
        text-align: center;
    }

    .download #getitPod .podContent {
        padding: 15px 15px 30px 15px;
    }
}

/* styles for medium screens (320px)
   ========================================================================== */

@media all and (max-width: 320px) {}