/* CMS version 09/12/2014 */
/* Media quires for a responsive layout */
/* For tablets & smart phones */
@media (max-width: 767px) {
  .container {
    width: auto
  }
}
/* For smartphones */
@media (max-width: 600px) {
  .container {
    width: auto
  }
}
/* For smaller displays like laptops */
@media (min-width: 768px) and (max-width: 979px) {
  .container {
    width: 724px
  }
}
/* For larger displays */
@media (min-width: 1200px) {
  
}
 
@media screen and (max-width: 769px) {
    html {-webkit-text-size-adjust: 100%;}
    body {overflow-x: hidden;}
    #outer-container {overflow-x: hidden;}
    /*Show display none for the following div's */
    #Header, #bottom-header, #nav-bar, #main-body #right-column, 
    #shareBarModuleNew, .video-overlay, .video-duration {display: none!important;}
    #main-container {margin-top: 60px!important;}
    #main-container .bx-controls-direction {display:none;}
    #main-container .bx-wrapper .bx-viewport {left: 0px!important;}
    #footer-homepage{display: none!important;}
    #footer{display: none!important;}
    #homepage-mid {width: 100%!important;margin: 0px auto!important;}
    #homepage-popular {margin-right: 0 !important;padding: 0 10px !important;width:92%!important;}
    #homepage-popular h2 {color:#9C5FB5!important;}
    #homepage-popular #top {background: none!important; border: none!important;padding-left:0px!important;}
    #homepage-popular #bottom {border: none!important;padding-left:0px!important;}
    #homepage-popular #bottom ul li {width:100%!important; color:#333333!important;text-indent:-1em;list-style:disc inside none!important;}
    #homepage-video, #homepage-blog {display: none!important;}
    #homepage-widgets {position: relative!important;}
    #homepage-blog #bottom {height:auto!important;}
    .bread-crumb, #article-library {display: none!important;}
    .main-content #gallery-text {position: relative!important;}
    #category-gallery-top {display:none;}
    .main-body, #main-body #left-column, #main-content #category-gallery {width: 100%!important;}
    .main-body #left-column {margin-bottom: 0px!important}
    .main-content .topic-row .next-to-img {max-width: 68%!important;}
    .main-content .topic-row-text p {width: 120%;}
    .main-content .topic-row img {margin-right: 3%!important;}
    .main-content .topic-row .next-to-img  p {max-width: 100%!important;}
    .main-content #desktop-article-text, .main-content #spacer {display: none!important;}
    .main-content #gallery {width: 100%!important; margin-bottom: 14px!important;}
    .main-content #gallery img {display: block; width: 100%;}
    #left-column #topic-navigation-flat, #left-column #topic-navigation {display: none!important;}

    #mobile-article-text {width: 100%;}
    /*#mobile-article-text img {width: 100%!important;}*/
    .readmore-js-toggle {margin: 20px 0px 20px 10px!important;}
    .mobile-text-expanded {height: auto!important;}
    .main-content .topic-row-text h2 {margin-left: 0px!important; width: 120%;}
    #main-body #main-content {padding: 0px 10px 0px 10px;}

    #mobile-video {position: relative; margin-bottom:20px;width: 100%!important;height:250px;}
    .BrightcoveExperience {top: 0; left: 0; width: 100%!important; height: auto%!important;}

    #left-column #left-col-top-left, #left-column #left-col-top-right {width: 100%!important;}
    #left-column #left-col-top-right img {width: 100%;} 
    #left-column #left-col-top .form-image {display: none;}
    #alt-topic-layout {display: none;}

    #mobile-homepage-blog {
        float: left; 
        width: 100%;  
        height: auto;
        margin-bottom: 30px;  
        margin-top: -10px;
    }
    #mobile-homepage-blog #top {
        height: 20px;
        padding-left: 10px;
        width: 100%;
    }
    #mobile-homepage-blog h2 {
        color: #9c5fb5;
        font-size: 14pt;
    }
    #mobile-homepage-blog #bottom {
        background-color: #FFFFFF;
        height: 90px;
        padding-left: 10px;
        width: 100%;
    }
    #mobile-homepage-blog #bottom ul {
        margin-top: 12px;
    }
    #mobile-homepage-blog #bottom ul li {
        line-height: 12pt;
        color: #333333;
        list-style-type: disc;
        list-style-position: inside;
        margin-bottom: 8px;
        margin-left: 0px;
        width: 90%;
    }
    #mobile-homepage-blog #bottom ul li a:link, 
    #mobile-homepage-blog #bottom ul li a:hover, 
    #mobile-homepage-blog #bottom ul li a:visited {
        color: #868686;
        font-family: verdana;
        font-size: 8pt;
        line-height: 12pt;
    }


    /********* Addition for about us page *************/
    #news-video-row {
        width: 96%!important;
        height: auto!important;
        overflow: hidden;
        padding: 10px 0px 10px 0px!important;
        border-top: 1px solid #9C5FB5!important;
        border-bottom: none!important;
    }
    #news-column {
        width: 95%!important;
        height: auto!important;
        margin-bottom: 10px;
        border: none!important;
    }
    #video-column {
        width: 100%!important;
        height: auto!important;
        border-top: 1px solid #9C5FB5;
    }
    #video-column-left {
        width: 90%!important;
        padding: 10px 0px;
    }
    #news-video-row h2{
        margin-left: 0px!important;
        font-size: 10pt!important;
    }
    #video-column-right {
        float: left!important;
        width: 90%!important;
    }
    #educate-contact-us-row {
        width: 96%!important;
        height: auto!important;
        overflow: hidden;
        padding: 10px 0px 10px 0px!important;
        border-top: 1px solid #9C5FB5!important;
        border-bottom: none!important;
    }    
    #educate-column {
        width: 95%!important;
        height: auto!important;
        margin-bottom: 10px;
        border: none!important;
    }    
    #contact-us-column {
        width: 100%!important;
        height: auto!important;
        border-top: 1px solid #9C5FB5;
        padding: 10px 0px;
    }    
    #educate-contact-us-row h2{
        margin-left: 0px!important;
        font-size: 10pt!important;
    }    
    #mobile-gallery img {
        width: 100%;
    }
    #mobile-contact-us-gallery p {
        padding-bottom: 10px;
        width: 100%!important;
    }
    #news-results-container {
        width: 96%!important;
        height: auto!important;
    }
    #news-results-container ul {
        margin-left: 10px!important;
    }
    .ArticleAbstractBlock  {
        border: none!important;
        width:98%!important;
    }

    .ArticleAbstractBlock h2 {
        font-size: 12pt!important;
    }  

    .ArticleAbstractBlock ul {
        list-style: none!important;
        padding: 0px!important;
    }
    .ArticleAbstractBlock li {
        margin-bottom: 15px!important;
        list-style-type: none!important;
        width: 92%!important;
        list-style-position: inside;
        list-style-type: disc!important;
        margin-left: 23px !important;
        text-indent: -1em;
    }
    #report-contact {
        width: 95%!important;
    }
    #news-pager {
        width: 96%!important;
        margin-left: 10px;
        margin-top: 10px!important;
    }
    #news-reporter {
        margin: 20px 0px 35px 0px!important;
        border-top: 1px solid #9c5fb5;
        width: 96%;
    }

    .newsResults-Pager {
        background-color: #9b5ab6;
        border-radius: 7px;
        float: left;
        height: 35px;
        margin: 0px 2px 0px !important;
        text-decoration: none;
        width: 25%;
        color: #9b5ab6;
        padding-top: 10px;
    }
    .newsResults-Pager a:link {
        color: #ffffff!important;
        font-size: 80%!important;
    }
    .newsResults-Pager a:hover {
        text-decoration: none!important;
        font-size: 80%!important;
    }

    #newsResults-PagerNext {padding: 8px 7px 4px 2px;float:right;margin-right:10px!important; text-align: center;}
    #newsResults-PagerPrev {padding: 8px 7px 4px 2px;float:left;}
    #newsResults-PagerLast {display:none!important;}
    #newsResults-PagerFirst {display:none!important;}

    .newsResults-PagerInternal{display: none!important;}

    #news-gallery {display: none!important;}
    #mobile-contact-us-gallery img {width: 100%; margin-top: 10px; border-radius: 0px;}

    /************ Contact us page *********/
    .privacy_info {
        margin-left: 0px!important;
    }
    .form_wrapper {
        width: 100%!important;
        min-width: 0px!important;
        height: auto!important;
    }
    .information {
        width: 96%!important;
    }
    .form_wrapper .field_container {
        width:96%;
    }
    .title_small {margin-bottom: 20px!important;}
    .title_small p {width: 100%!important;}
    .title_big {margin-top: 20px;margin-bottom: 20px!important;}
    .chapters_contacts_title {width: 80%!important;}
    .chapters_contacts {margin-top:0px!important;height:auto!important;margin-bottom:30px;}
    #chapterDataContainer .chapterData {margin-right: 10%!important;width: 40%!important;margin-bottom: 15px;}

    /************ Search Page *************/
    #search-results h1 {
        color: #9C5FB5!important;
        font-size: 16pt;
    }
    #search-header {
        clear: both;
        width: 100%!important;
        height: 45px;
    }
    #search-header h2 {
        margin-left: 0px!important;
        width: 70%!important;
        margin-top: 10px;
        float: left;
        margin-bottom: 0px!important;
        color: #9c5fb5!important;
    }
    #search-results #showing {
        margin: 20px 0px 10px 0px!important;
    }
    #searchResultsContainer {
        padding-left: 0px!important;
        width: 100%;
    }
    #searchResultsPager {
        width: 100%;
        text-align: center;
        font-size: 80%;
    }
    .searchResultURL {color: #9c5fb5!important;}
    .searchResultCopy em {color:#ed6d3b!important;}

    #facetContainer-media {
        margin-left: 0px;
        margin-right: 0px;
        overflow: auto;
        clear: both;
        background-color: #e4e4e4;
        color: #9c5fb5!important;
        padding: 10px 0px 10px 10px;
        margin-bottom: 0px!important;
        margin-top: -20px;
        border-bottom: 1px solid #9c5fb5;
        border-right: 1px solid #9c5fb5;
        border-left: 1px solid #9c5fb5;


    }
    #facetContainer-media > span {
        width: 45%;
        margin-right: 10px!important;
        color: #ffffff!important;
    }
    #facetContainer-media ul li {
        width: 45%;
        float: left;
        margin-bottom: 10px;
    }

    .desktop-search-header {display: none;}

    .searchResults-Pager {
        background-color: #9b5ab6;
        border-radius: 7px;
        float: left;
        height: 25px;
        margin: 0px 2px 15px !important;
        text-decoration: none;
        width: 25%;
        color: #9b5ab6;
        padding-top: 10px;
    }
    .searchResults-Pager a:link {
        color: #ffffff!important;
        font-size: 90%!important;
    }
    .searchResults-Pager a:hover {
        text-decoration: none!important;
        font-size: 90%!important;
    }
    #searchResults-PagerNext {padding: 8px 7px 4px 2px;float:right;margin-right:10px!important}
    #searchResults-PagerPrev {padding: 8px 7px 4px 2px;float:left;margin-left:10px!important}

    #searchResults-PagerLast {display:none!important;}
    #searchResults-PagerFirst {display:none!important;}

    .searchResults-PagerInternal{display: none!important;}

    #mobile-filter {
        width: 25%;
        background-color: #e4e4e4;
        height: 35px;
        float: right;
        color: #FFF;
        padding: 8px;
        margin-top: 10px;
        margin-right: 0px;
        border: 1px solid #9c5fb5;
    }
    .mobile-filter-video {
        margin-right: 10px!important;
        height: 40px!important;
    }
    #mobile-filter a {color: #9c5fb5;}
    /*************** Privacy Policy **************/
    #main-container .container {
        width: 100%!important;
        margin-top: 20px;
        padding: 0px 10px!important;
    }
    #main-container .container h1 {font-size: 18pt!important;}
    .ui-tabs .ui-tabs-panel {width: 100%!important;}
    .ui-tabs-nav {display: none!important;}
    .mobile #divWizardOuter table td{float: left;}
    .mobile #divWizardOuter{width: auto;}
    .mobile #divQuickWizardNextButton{width: auto;}
    #privacy, #editorial, #link, #terms-of-use, #state-disclosure-notice {margin-left: 10px;}
    .tabContainer {display: none!important;}
    .hide-more {display: none!important;}
    .show-more {display: block!important;}
    #tabs .styled-select {width: 93%!important;}

    /****************** Article Library Page ***********/
    #library-menu, #library-heading-blank {display: none!important;}
    #library-page #library-bottom {border: none!important;width:100%!important}
    #library-page {width: 100%!important; margin: 15px 0px 20px 0px!important;overflow:hidden!important;}
    #library-page h1 {margin-top: 10px;}
    #library-page h3 {display: none;}
    #library-page header {border: 0px!important}
    #library-heading #library-heading-articles {margin-top: 10px;}
    #mobile-library-select {margin-bottom: 10px;margin-left: 0px;width: 94%;}
    #library-bottom #library-lists, .library-column, {width:96%!important;} 
    .library-column ul {width:96%!important; margin-left: 0px!important;padding: 0px;}
    .library-column ul li a:link, .library-column ul li a:active, .library-column ul li a:visited, .library-column ul li a:hover {text-decoration:underline;color: #9c5fb5!important;}
    .library-column li {list-style: none!important}
    #library-bottom #library-lists {padding-top: 2px!important;}

    /********* FAQ Pae *******************/
    #faq {width: 100%;margin-bottom:30px;} 
    #faq-intro {width:100%;}
    #faq h3:nth-last-child(2) {margin-bottom: 0px;}
    #faq-page #faq h3 {
        background-color: #e4e4e4;
        padding-top: 10px;
        padding-left: 15px;
        color: #000!important;
        width: 110%;
        height: 40px;
        margin-left: -15px;
        font-size: 15pt!important;
        
    }
    #faq-page #faq h3 a {
        color: #000!important;
        font-weight: normal!important;
    }
    #faq .faq-arrow {display: none!important;}
    

    /********* Due Date Calculator ********/
    #due-date-calc {background-image: none!important;width:100%!important;padding:0px!important;height:auto!important;}
    #due-date-calc-top {width: 100%!important;}
    #due-date-calc-top h2 {width: 94%!important;}
    #due-date-calc-bottom {width: 94%!important; margin-left: 0px;} 
    #due-date-calc-bottom #calc {margin-bottom: 30px;} 
    .calc-desktop-button, #due-date-text {display:none!important} 
    #due-date-calc #calcform {width: 100%!important;margin-bottom:30px;height: auto!important;}
    #ddc-month {
        width: 41%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
    }  
    #ddc-date {
        width: 20%!important;
        margin-left: 6%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
    }
    #ddc-year {
        width: 25%!important;
        margin-left: 6%!important;
        float: right!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
    }
    #ddc-year select, #ddc-date select, #ddc-month select, #ddc-day-amount select {
        padding: 8px 0px 0px 4px !important;
        color: #9c5fb5!important;
        font-size: 12pt!important;
        font-weight: bold!important;
    }
    .result-margin-present h2, .result-margin-future h2 {
        font-size: 12pt!important;
        float: left;
        width: 20%;
        line-height: 16px!important;
        margin-top: 20px!important;
    }
    .result-margin-present h3, .result-margin-future h3 {
        font-size: 12pt!important;
        float: left;
        width: 70%;
        color: #868686!important;
        line-height: 16px !important;

    }
    #due-date-calc #week {
        width: 100%;
    }
    #due-date-calc .button {
        width: 100%!important;
        line-height: 40px;
    }
    #due-date-calc #error, #due-date-calc #error h3 {
        width: 100%!important;
    }
    /********* Ovulation Calculator ********/
    #preg_calc_container {width: 100%!important;}
    #preg_calc_container #instructions p {display: none;}
    #instructions {width: 100%!important;margin-bottom:0px!important;}
    #calc {width: 100%!important;height:auto!important;padding: 0px!important;border: none!important;}
    #calc-question-mark {margin-top:0px!important;}
    #preg_calc_container #calcform {width: 100%!important;margin-bottom:30px;}
    #calc-controls {width:100%!important;}
    #preg_calc_container #calc h3 {width: 100%!important; margin-top: 15px!important;}
    #resultsLeft {float: none!important;width:100%!important;margin-left: 0px!important;clear:both;}
    #resultsRight {float: none!important;width:100%!important;margin-left: 0px!important;margin-top:0px!important;}
    #calcform #rule {display: none!important;}
    #calc-question-mark {height: auto!important;}
    #calc-controls h3 {margin-top: 0px!important;}
    #calc-month {
        width: 41%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
    }  
    #calc-date {
        width: 20%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
        margin-left: 5%!important;
    }

    #calc-day-amount {
        width: 20%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
        margin-left: 0px!important;
    }
    #calc-year {
        width: 26%!important;
        height: 40px!important;
        overflow: hidden;
        background: url(../images/new_arrow.png) no-repeat 95%!important;
        border: 1px solid #afafaf;
        border-radius: 6px;
        margin-left: 5%!important;
    }
    #calc-year select, #calc-date select, #calc-month select, #calc-day-amount select {
        padding-top: 8px!important;
        color: #9c5fb5!important;
        font-size: 12pt!important;
        font-weight: bold!important;
        width: 120%!important;
    }

    /************ Partner List ******************/
    #partners-list { width: 100%!important; padding: 0 10px!important;}
    .partner-item {width:100%!important;}
    .partner-item .partner-copy {width: 93%!important;}
}

@media screen and (min-width: 768px) {
    
    #mobile-header-container, 
    #mobile-contact-us-gallery, 
    #mobile-signin-block,
    #mobile-signup-block,
    #mobile-incorrect-login-block,
    #mobile-signin-multiple-accounts-block, .mobile-video-overlay, .mobile-video-title {display:none;}
    #mobileNav-container, .mobile-search-header {display:none;}
    .calc-mobile-button {display:none!important} 
    #search-results h1, #search-header h2 {color:#9c5fb5!important}    
    .mobile {display: none;}    
    #mobile-video-container {display:none;}
    #mobile-video-homepage {display:none;}
    #mobile-footer-container {display:none;}
    #mobile-category-gallery-top {display:none;}
    #mobile-library-select, #mobile-topic, #mobile-article-text, .readmore-js-toggle, #mobile-homepage-blog  {display:none!important;}
    #video-lists, #video-most {display: none;}
    .desktop-filter-list {display: block!important;}
    .mobile-tabContainer {display:none!important;} 
    .mobile-plus {display: none;}
    #faq-page #faq h3, #faq-page #faq h3 a:link, #faq-page #faq h3 a:active, #faq-page #faq h3 a:visited {
        font-weight: bold;
    }
    #mobile-filter, #responsive-video {display: none!important;}
}
 
/* =============================================================================================*/
/* Mobile Video CSS                                                                             */
/* version: 1.1                                                                                 */
/* Last Modified: 04/09/14                                                                      */
/* Modified by: Scott Shapiro;                                                                  */
/* =============================================================================================*/
/* Mobile Video Container */
#mobile-video-container {
    width: 110%!important;
    height: auto!important;
    float: left;
    margin-top: 10px;
    margin-left: -15px;
}
#mobile-video-container-top {
    width: 94%;
    border-top: 1px solid #9c5fb5;
    padding: 10px 0px 50px 0px;
    margin: 0px 0px 0px 10px;
}
#mobile-video-container-top h2 {
    color: #9c5fb5;
    float: left;
    width: 40%;
}

/* Mobile Video Container Homepage */
#mobile-video-homepage {
    width: 100%!important;
    height: auto!important;
    float: left;
    margin-top: 10px;
}
#mobile-video-homepage-top {
    width: 94%;
    border-top: 1px solid #9c5fb5;
    padding: 10px 0px 50px 0px;
    margin: 0px 0px 0px 10px;
}
#mobile-video-homepage-top h2 {
    color: #9c5fb5;
    float: left;
    width: 40%;
}

/* Play video icon */
.mobile-video-play-icon {width: 100%; position: absolute; top:20%; left:40%}
.mobile-video-play-icon img { width:20%}
/* Title Overlay container */
.mobile-video-title-container {position: absolute; bottom:0px;width:100%; height:53px;background-color: #E76D4E; color: #ffffff;opacity:.8;}
.mobile-video-title-container h3 {width:97%; height:auto; margin-top:5px; overflow:hidden; padding:4px 4px 4px 4px; text-align:center; line-height:100%; font-family:verdana; font-size: 90%;float:left }

#mobile-topic {
    margin-bottom: 10px;
}
.readmore-js-toggle {
    text-align: center;
    font-size: 10pt;
    font-weight: bold;
    width: 95%!important;
    color: #9c5fb5 !important;
}
/* =============================================================================================*/
/* Select box for Mobile pages
/* version: 1.1                                                                                 */
/* Last Modified: 04/09/14                                                                      */
/* Modified by: Scott Shapiro;                                                                  */
/* =============================================================================================*/
.styled-select {
    width: 100%;
    height: 40px;
    overflow: hidden;
    background: url(../images/new_arrow.png) no-repeat 95%;
    border: 1px solid #afafaf;
    border-radius: 6px;
    clear: both;  
}
.styled-select select {
    background: transparent;
    width: 110%;
    height:40px;
    padding: 5px;
    font-size: 16px;
    line-height: 1;
    border: 0;
    font-family: helvetica;
    color:#9c5fb5;
    font-size: 12pt;
    -webkit-appearance: none;
}