/*Covid-19 CSS*/
/* MAIN NAVIGATION START */

.spanish-english, .spanish-english-mobile { text-align: right; margin-right:1em;font-size:16px;font-weight:bold; }
.spanish-english a, .spanish-english-mobile a { color:#666d70; }
.spanish-english a:hover, .spanish-english-mobile a:hover { color:#323E48;}


/*Home Page Images*/
.homeimg { background-image:url(/covid-19/img/landing-pg-banner.png);background-size:cover;background-position:top; }
.vaccineHomeimg { background-image:url(/covid-19/img/vaccine-header.jpg);background-size:cover;background-position:center; }

.box-subheader-small.box-one-home-page:before { background: transparent url(/covid-19/img/covid-tout-prevention.jpg);height: 170px;width: 320px;border-radius: 3px; }
.box-subheader-small.box-two-home-page:before { background:transparent url(/covid-19/img/covid-tout-cdc.jpg);height:170px;width:320px;border-radius:3px; }
.box-subheader-small.box-three-home-page:before { background: transparent url(/covid-19/img/covid-tout-brainManager.jpg);height: 170px;width:320px;border-radius: 3px;  }


@media only screen and (max-width:61.875em) {
    .box-subheader-small.box-one-home-page:before {  height:138px;width:260px;background-position:right; }
    .box-subheader-small.box-two-home-page:before { height:138px;width:260px;background-position:right; }
    .box-subheader-small.box-three-home-page:before { height:138px;width:260px;background-position:right; }
}


/*.................COVID SUB PAGES START ....................................*/

.covid-event-pg dl { margin-bottom:20px; }



/*SUB PAGE LAYOUTS*/
    .main-header-page {
        color: #323e48 !important;text-align: center !important;font-size: 37px !important;font-weight: normal !important;font-style: normal !important;
        font-stretch: normal !important; line-height: normal !important;letter-spacing: -0.4px !important;
    }

  
    /*Layout Specifics*/  
    .mega-nav-full-pg-width, .mega-nav-full-pg-width-white-bg { padding: 2% 0;margin:5% 2%; position:relative; }
    .mega-nav-full-pg-width { background: #eeeeee;border-radius:3px; }
    .mega-nav-full-pg-width-white-bg { background:#fff; }

  /*SUB PAGE CONTENT SPECIFIC AND FEATURES*/


/*Vaccine Pg Logos*/ 
       div.containerIMG { height: 50px;margin-top:10px;padding:20px 0 0 20px;display: flex;align-items: center; justify-content:flex-start; }
        div.containerIMG img { margin-top: 10px }
 /*STAYING IN TOUCH EVENT PAGES*/
        .staying-in-touch-header { padding:2% 8%; } 
        .stayingInTouch-headerImg { width: 100%;height: 100%;object-fit: cover;background-position: left; }
    
        .covid-event-pg { padding:0 8%;line-height:1.4em !important; }
        .covid-event-pg .main-header-page {text-align:left !important;}
        .covid-event-pg a {color:#af4591 !important;font-weight:bold;text-decoration:none;font-size:16px; }
        .covid-event-pg a:hover {text-decoration:underline !important;}
        .covid-event-pg .orchid500-button { display:inline-block; background-color:#af4591; font-size:14px; text-align:center; font-weight:700;color:#fff !important; text-decoration:none; padding:15px 30px; border-radius:3px; margin-bottom:30px;}
        .covid-event-pg .orchid500-button a { color:#fff !important; }
        .covid-event-pg .orchid500-button:hover { background-color: #64144f;text-decoration:none !important; }



        /*.covid-event-pg .home  h1 { margin:60px 0 20px 0; }*/
        .events-landing-graphic { float:right;margin:0 0 0 50px;padding-top:0;height:20%;width:20%;}
        .white-block-row-covid-event { width:unset !important;border-bottom:solid #af4591 2px;padding:20px 0; }
        .white-block-row-covid-event p:first-of-type {font-size:1.3em; }
        .covid-event-pg .white-block-row h2 { padding:0px !important;margin:0px !important;font-weight:bold !important;min-height:10px !important;font-size:18px !important;padding-top:10px !important; }
        .covid-event-pg .white-block-row a {color:#771b61;}
        .event-info-one { padding:0 0 50px 0;width:95%;}
        .event-info-two  { background-color:#fcf7fb;padding:30px;min-width:350px;margin-bottom:30px; }
        .event-info-two a { color:#771b61; }
        .covid-speakers { width:70%;margin:0;padding:0; }
        .speaker { color:#771b61;font-weight:bold;font-size:16px; }
        .speaker-title { font-weight:600;line-height:19px;letter-spacing:-0.14px;color:#323e48;font-size:14px; }

        .covid-event-pg .white-block-row {padding:0px !important;margin:0px !important;/*border:dotted;*/ }
        .participate-header { font-weight:bolder;color:#771b61;margin:0px;padding:0px; }
        .staying-in-touch  { font-size: 43px;font-weight: bold;font-stretch: normal;font-style: normal;letter-spacing: -0.45px;text-align: left;color: #771b61;margin:0 0 20px 0;line-height:1em; }

        .resource-header { color:#771b61;}
        .subject-area-text {line-height:1.4em;}
        .events-video { margin:0 5%;}
        .more-episodes-intro { margin-left:30px;}
    
      

        /*RESOURCES*/
        .hide-resources { display: none; }
        .resource-drop-down {width:60%;height:50px;padding:10px 50px 10px 10px;border:solid 1px #bac0c2;} 
       @media only screen and (max-width: 48em) { 
           .resource-drop-down { width:100%; }
           }


        .web-event-resource-title  { font-weight:900!important ; color: #771b61 !important;font-size: 22px !important;}
        .resources-text { font-size:14px;line-height:1.8em;color:#323e48; }
        .covid-event-pg.text-disclaimer { margin:40px 0 30px 0; }


              
       /*Spanish Blog*/ 
.flex-header-text-image { display: flex; flex-wrap: wrap; background-color:#fff; }
.flex-header-text-image > div { width: 50%;margin: 0;font-stretch: normal;font-style: normal;line-height: 1.14;letter-spacing: -0.37px;text-align: left;color: #323e48; }
.flex-header-text-image h1 {font-size: 37px;font-weight: 500; }

.flex-header-text-image div:first-of-type { /*padding:70px 50px 0 160px;*/ padding:  3% 3% 0 10%; }
.flex-header-text-image > div img { max-width: 100%;max-height: 100%;}

@media only screen and (max-width:61.875em) {

.flex-header-text-image { flex-direction: column-reverse; }
.flex-header-text-image > div { width: 100%;text-align: center; }
.flex-header-text-image div:first-of-type { padding:0 3%; } 

}
      

.rxwell-callout-image { background-image:url(/covid-19/img/rxwell-app.jpg);background-repeat:no-repeat; background-size: cover; }

@media only screen and (max-width:61.875em) {
.rxwell-callout-image { background-position:right; }
}
@media only screen and (max-width:28.875em) {
    .rxwell-callout-image { background-size:auto; background-position-x:-28px; }

}
/* ul with checkmark circle list type */

    .checkmark-circle-list  { padding-left:0 !important;font-size: 18px;font-weight: 500; }
    .checkmark-circle-list > li { list-style-type:none;padding: 0 0 0 45px;position:relative;margin: 0 0 16px 0;line-height: 1.25em;width: 55%; }

    .checkmark-circle-list > li:before { 
    
        /*fill it with a blank space*/ 
        content:"\00a0";

        /*make it a block element*/
        display: block;
 
        /*adding an 8px round border to a 0x0 element creates an 8px circle*/
        border: solid 1px #771b61;padding:8px;border-radius: 8px;-moz-border-radius: 9px;-webkit-border-radius: 9px;height: 0;width: 0;
 
        /*Now position it on the left of the list item, and center it vertically
        (so that it will work with multiple line list-items)*/
        position: absolute;left: 7px;/*top: 40%;*//*margin-top: -8px;*/top:3px;

         -webkit-box-sizing:unset; box-sizing: unset;
    }

    .checkmark-circle-list > li:after{
        /*Add another block-level blank space*/
        content:"\00a0";display:block;
 
        /*Make it a small rectangle so the border will create an L-shape*/
        width: 3px;height: 6px;
 
        /*Add a white border on the bottom and left, creating that 'L' */
        border: solid #771b61;border-width: 0 2px 2px 0;
 
        /*Position it on top of the circle*/
        position:absolute;left: 14px;/*top: 40%;*/margin-top: 6px;top:0;
 
        /*Rotate the L 45 degrees to turn it into a checkmark*/
        -webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);

        -webkit-box-sizing:unset; box-sizing: unset;
    }





    /*SUB PAGE CONTENT SPECIFIC AND FEATURES END*/

    .content-center-div {
        text-align: center;
        margin: 0 10%;
        padding-bottom: 2em;
    }

    .center-div {
        text-align: center;
        margin: 5%;
        clear: both;
    }

    /* COVID IMAGES START*/
    .covid19-header {
        height: 250px; background-position: center; border-bottom: #af4591 solid 5px;
    }
    .covid19-header { background-image:url(/covid-19/img/covid19-header.png); }
 
    @media only screen and (max-width:48.875em) {
        .mega-nav-content-pg-layout { margin: 0 7% 5% 7%; }
      .covid-event-pg h1 { margin:0 0 20px 0;font-size:32px; }
        .main-header-page { font-size:26.5px !important; }
    
        /* Landing page images */
        .landing-page-section {
            margin: 5% 3%;
        }
        .landing-content .subject-area-hero { width: 35%; }
        .landing-content .subject-area-text { padding-left:15px; }


        .subject-area-text { margin:auto; }
        .landing-pg-intros { font-size: 18px;font-weight:600;line-height:20px; }
        .landing-pg-image {width:96%; margin-top:2%;}
      

         /*STAYING IN TOUCH EVENT PAGES*/

           .stayingInTouch-headerImg { height:100px;object-position: 0% 30%;margin-top:20px; }
            .staying-in-touch-header { object-fit: none; } 

            .white-block-row-covid-event { padding:0 0; }
           .covid-event-pg {margin:0; }
           .covid-speakers {width:100%; }
           .event-info-one { width:100%;padding:20px 0px; }
           .event-info-two { padding:0px;min-width:0;padding:20px 20px;}
           .covid-event-pg .white-block-row h2 { padding-top:unset !important; }
       }
   


@media only screen and (max-width:28.875em) {
    .column { width: 100%; }
    .additional-resources h2 {text-align:center;width:98%;}
    .gray-top-triangle:after, .gray-top-triangle:before {display:none;}
    
    .page-intro-no-line {padding-bottom:20px;margin-bottom:20px;}

    .covid19-header {
        background-position-x: 720px;
    }

}


@media only screen and (min-width: 48em) {  
    
   .content-center-div {margin: 0 20%;}
}

/* TESTING PAGE ICONS */
        .testingPg-icons-box {position: relative; min-width: 100px;text-align: center; vertical-align: middle;float: left; /*line-height: 150px;*/ margin:0 3% 5% 2%;}
        .testingPg-icons-box img { height: 100%; vertical-align: middle; }
        .testingPg-icons-longer-text { margin:15% 0 45% 0; }

        @media only screen and (max-width:48.875em) {
            .testingPg-icons-box { float: none; margin:0;width:100%; }
            .testingPg-icons-box img { height: 80%; vertical-align: middle;margin:0 0 5% 0; }
        }


/*.................WEB EVENTS CALLOUT ....................................*/
    /* Event preview image also called the same, so no new class or styling needs updated, just rename the image  */
    .covid19-upcoming { background-image: url(/covid-19/img/SIT-events/upcoming-event.png); }
    .covid19-upcoming-es { background-image: url(/covid-19/img/SIT-events/upcoming-event-es.png); }
    .covid19-upcoming-bonus { background-image: url(/covid-19/img/SIT-events/upcoming-event-bonus.png); }
    .covid19-upcoming-bonus-2 { background-image: url(/covid-19/img/SIT-events/upcoming-event-bonus-2.png); }
  /*Just rename the image for the preview/upcoming episode, don't create a new class*/

    .SIT-speaker-spacing::after { content: "\A"; white-space: pre-line }
    .SIT-speaker-spacing2::before { content: "\A"; white-space: pre-line }

    .eventsCallout-page-section { background-color:#fff;margin:1% 3%;border-radius:43px; /*padding: 0; */ }
    .eventsCallout-page-section .orchid500-button {margin-top:10px;margin-bottom: 10px; }
    .eventsCallout-pg-intros {color:#323e48;font-size: 25px;font-weight: bold;line-height:26px;letter-spacing:-0.25px;}
    .eventsCallout-content { display:table; max-width:100%; box-sizing:border-box;padding:1%;}
    .eventsCallout-content .eventsCalloutSubject-area-hero { width:45%; padding:0;display:table-cell; vertical-align:middle; background-repeat:no-repeat;/*margin-right:240px !important;*/ }
    .eventsCallout-content .eventsCalloutSubject-area-text { position:static; top:0; margin:1% 0;padding:0 20px;  right:0; background-position:0; }
                         .eventsCalloutSubject-area-text { padding: 0 /*40px*/;font-size: 14px;line-height: 18px;letter-spacing: -0.14px;color: #323e48; }
    .eventsCallout-pg-image { 
          background-size: cover;background-repeat: no-repeat;min-height:245px;min-width:300px;background-position-x:-20px;/*min-height: 100px;min-width: 200px;width: 400px;height: 240px;*/margin: auto;/*resize: both;*/overflow: hidden;border-radius: 3px;
        }

@media only screen and (max-width:48em) {
    .eventsCallout-content .eventsCalloutSubject-area-hero { width: 30% !important;}

    .eventsCallout-pg-image { background-size: cover;background-repeat: no-repeat;min-height:150px;max-width:175px;min-width:175px;background-position-x:-12px; }
    .eventsCallout-pg-intros { font-size: 16px;line-height: 28px; }
    .eventsCallout-content .eventsCalloutSubject-area-hero { vertical-align: top;padding-top:4%; }

  
    }

 @media only screen and (max-width:28.875em) {
    .eventsCallout-content {display:block;}
     .eventsCallout-pg-image { background-size: cover;background-repeat: no-repeat;min-height:245px;min-width:300px;width:100%;}
    .eventsCallout-content .eventsCalloutSubject-area-hero {  margin:auto !important;}
    .eventsCallout-content .eventsCalloutSubject-area-text  { padding:3% 5%; }
    .eventsCallout-pg-intros {font-size: 25px;max-width:240px;}
    .eventsCallout-pg-image { min-height:200px; }
      .checkmark-circle-list > li {
        width: 95%;
    }
}


@media only screen and (max-width:15em) {
    .eventsCallout-pg-intros { font-size: 16px;line-height: 28px; }
    .eventsCallout-content .eventsCalloutSubject-area-hero {
       display:none;
    }


}