/*------------ Stylesheet Contents ----------------------------------------------------------

 - General Page Rules

 - Template Specific Rules

 - General CMS Rules

 - Blog Module Rules
 - Calendar Module Rules
 - Contacts Module Rules
 - Document Group Module Rules
 - FAQ Module Rules
 - Forum/Message Board Module Rules
 - Latest News Module Rules
 - Menu and Sub-Menu Rules (Non-slideout style)
 - Menu and Sub-Menu Rules (Slideout style)
 - Newsletter Module Rules
 - Pole Module Rules
 - Site Search Rules
 - Testimonial Module Rules

*/

/*------------ General Page Rules ----------------------------------------------------------*/

html, body
{
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}

BODY, TABLE {font-family: Arial, Helvetica, sans-serif; font-size:12px; color:#666; }

form { margin: 0; padding: 0; }

form input { }

form textarea { }

h1, h2, h3, h4, form, ul, ol, li, hr, p { margin: 0; padding: 0; }

p { }

a { color: #9957c5; text-decoration: underline;}

td
{
vertical-align: top;
}

a img
{
border: none;
}


/*------------ Template Specific Rules ----------------------------------------------------------*/

/* Main page container styles */

body
{
border-top: 6px solid #deafff;
}

#container
{
margin-left: auto;
margin-right: auto;
width: 960px;
text-align: left;
}

#bgcontainer
{
width: 960px;
float: left;
position: relative;
}

#header
{
float: left;
position: relative;
width: 960px;
height: 196px;
}

#leftCol
{
float: left;
position: relative;
width: 183px;
min-height: 196px;
margin: 0px 0px 0px 5px;
}

#homeSlidesContainer
{
float: left;
position: relative;
width: 757px;
height: 309px;
background: none;
}

#centerCol
{
float: left;
position: relative;
width: 547px;
min-height: 196px;
}

.podcasts #centerCol
{
width: 765px;
}

@media screen and (max-width: 500px) {

    .podcasts #centerCol
    {
    width: 100%;
    }
}

#pageEditorContainer
{
float: left;
position: relative;
width: 467px;
padding: 0px 40px;
}

.podcasts #centerCol #pageEditorContainer
{
width:100%;
box-sizing:border-box;
padding-right:0;
}


#pageEditorContainer .symptomPopup img
{
border:1px solid #999;
}

#home #pageEditorContainer
{
float: left;
position: relative;
width: 507px;
padding: 20px;
margin: 9px 0px;
background: url(https://www.meningitis.org.nz/images/style/home_content_bg_tile.png) top left repeat-y;
}

#home #pageEditorContainer .symptomPopup img
{

border:1px solid #999;
}

#home #pageEditorContainer hr
{
border-top: 1px dashed #fcac16 ;
}

.bannerText
{
padding: 10px 20px 10px 20px;
background: url(https://www.meningitis.org.nz/images/style/banner_text.png) no-repeat;
color:#FFFFFF;
}

.podcasts .bannerText
{
padding: 10px 20px 10px 20px;
background: #16adb6;
border-radius:10px;
color:#FFFFFF;
margin-bottom:30px;
}

#rightCol
{
float: left;
position: relative;
width: 201px;
min-height: 196px;
margin: 0px 9px 0px 15px;
}


/* Element Styling */

h1
{
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 26px;
color: #9957c5;
margin: 0px 0px 15px;
}

h2
{
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 20px;
color: #16adb6;
margin: 10px 0px;
}

#leftCol h2,
#rightCol h2,
#home #pageEditorContainer h2
{
font-size: 24px;
color: #9957c5;
}

h3
{
font-family: 'Muli', sans-serif;
font-weight: 600;
font-size: 16px;
color: #16adb6;
margin: 10px 0px;
}

h4
{
font-family: 'Muli', sans-serif;
}

p
{
margin: 10px 0px;
padding: 0;
line-height: 20px;
}

ul
{
margin: 10px 0px;
padding: 0px 0px 0px 20px;
color: #9957c5;
}

ol
{
margin: 10px 0px;
padding: 0px 0px 0px 30px;
}

li
{
margin: 4px 0px;
}

li p
{
color: #777;
margin: 0px;
}

a
{

}

hr
{
background: none;
border: none;
border-top: 1px dotted #666;
margin: 10px 0px;
}

img
{

}

td
{

}


/* Components */


/* Header Styling */

a.logo
{
float: left;
margin: 7px 0px 0px 0px;
}

a.logo img
{

}

.headerText
{
float: right;
position: relative;
width: 460px;
height: auto;
margin: 78px 4px 0px 0px;
font-size: 16px;
border: 1px dotted #ccc;
padding: 10px 0px 10px 20px;
}

.headerText p
{
display: inline-block;
float: left;
position: relative;
width: 215px;
font-family: 'Muli', sans-serif;
font-weight: 700;
font-size: 20px;
color: #9957c5;
}

.headerText p span
{
display: inline;
float: none;
width: 100%;
text-align: left;
font-weight: 400;
font-size: 14px;
color: #666;
}

.headerText span
{
display: inline-block;
float: left;
position: relative;
width: 30px;
text-align: left;
font-size: 14px;
margin: 18px 0px 0px 0px;
}



/* Left Navigation Styling */

#navigation
{
float: left;
position: relative;
width: 176px;
}

#navigation ul
{
font-family: 'Muli', sans-serif;
font-size: 14px;
list-style: none;
margin: 2px 0px 25px 0px;
padding: 0;
}

#navigation ul li
{
line-height: 18px;
margin: 0;
padding: 0px;
border-top: 1px dotted #ccc;
}

#navigation ul li a
{
display: block;
padding: 7px 0px;
text-decoration: none;
color: #8d8d8d;
}

#navigation ul li ul
{
font-family: 'Muli', sans-serif;
font-size: 14px;
list-style: none;
margin: 0px;
padding: 5px 0px;
border-top: 1px dotted #ccc;
}

#navigation  ul li ul li
{
line-height: 18px;
margin: 0;
padding: 0px;
border-top: none;
}

#navigation  ul li ul li a
{
display: block;
padding: 3px 0px 3px 20px;
text-decoration: none;
color: #8d8d8d;
font-family: Arial;
font-size: 12px;
}


#navigation ul li a.menuSelected
{
color: #16adb6;
font-weight: 700;
}

#navigation ul li a:hover
{
color: #16adb6;
}

/* Personal Stories Callout Styling */


#personalStoriesCallout
{
float: left;
position: relative;
width: 156px;
padding: 15px 10px;
margin: 0px 0px 10px -10px;
background: #efefef;
}
#personalStoriesCallout a
{
text-decoration: none;
}

.moduleComponentpersonalStories
{

}

.moduleComponentpersonalStories .componentItem
{

}

.moduleComponentpersonalStories .title
{
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 24px;
color: #9957c5;
text-align: center;
margin: 4px 0px 0px 0px;
}

.moduleComponentpersonalStories .moduleItemImage
{
float: left;
position: relative;
width: 162px;
height: 159px;
margin: 10px 0px 10px -4px;
background: url(https://www.meningitis.org.nz/images/style/thumb_bg.png) top left no-repeat;
}

.moduleComponentpersonalStories .moduleItemImage img.component
{
margin: 12px 0px 0px 13px;
}

.moduleComponentpersonalStories .content
{

}

.moduleComponentpersonalStories .readMore a
{
font-weight: 700;
color: #16adb6;
}


/* About the Foundation Callout Styling */

#aboutTheFoundationCallout
{
float: left;
position: relative;
width: 156px;
padding: 15px 10px;
margin: 0px 0px 20px -10px;
background: #efefef;
}

#aboutTheFoundationCallout h2
{
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 24px;
color: #9957c5;
margin: 0;
text-align: center;
}

#aboutTheFoundationCallout p
{

}

#aboutTheFoundationCallout p a
{
font-weight: 700;
color: #16adb6;
}



/* Home Slide Styling */

#homeSlides
{
float: left;
position: relative:
width: 765px;
height: 309px;
margin: 0px 0px 0px 0px;
}

#homeSlides img
{
width: 765px;
height: 309px;
}

#homeSlideContentOverlayRight
{
position: absolute;
top: 0;
right: -9px;
z-index: 1000;
width: 236px;
background: url(https://www.meningitis.org.nz/images/style/home_slide_green_bg.png) top left no-repeat;
}

#homeSlideContentOverlayRight p.whiteText
{
margin: 13px 25px;
color: #FFF;
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 19px;
line-height: 24px;
}

#homeSlideContentOverlayRight p.whiteText a
{
color: #FFF;
}

#homeSlideContentOverlayRight p.greyText
{
margin: 35px 25px 15px;
color: #858585;
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 14px;
line-height: 22px;
}

#homeSlideContentOverlayRight p.greyText a
{
color: #858585;
}

#homeSlideContentOverlayBottom
{
position: absolute;
bottom: 16px;
left: 12px;
z-index: 1000;
width: 497px;
height: 70px;
padding: 0px 10px;
background: none;
}

#homeSlideContentOverlayBottom p
{
color: #74379c;
font-weight: bold;
margin: 18px 35px 0px 25px;
font-size: 12px;
line-height: 16px;
}

/* News and Events Styling */

#newsAndEventsContainer
{
float: left;
position: relative;
width: 547px;
border-bottom: 1px dotted #ccc;
margin: 0px 0px 0px 0px;
}

#newsAndEventsContainer h2
{
color: #9957c5;
}

#newsAndEventsContainer .moduleComponentnewsAndAnnouncements
{

}

.moduleComponentnewsAndAnnouncements .componentItem
{
float: left;
position: relative;
width: 46%;
padding: 0px 3.5% 0px 0px;
}

.moduleComponentnewsAndAnnouncements .title
{
color: #9957c5;
}


.moduleComponentnewsAndAnnouncements .content
{
margin: 10px 0px;
padding: 0;
line-height: 20px;
}

.moduleComponentnewsAndAnnouncements .readMore a
{
font-weight: 700;
color: #16adb6;
}
/* News and Events Styling */

.fb-like-box
{
float: left;
position: relative;
width: 960px;
height: 260px;
margin: 0px 0px 30px 0px;
margin: 20px 0px 20px 0px;
}

/* Newsletter Styling */

#newsletterSignupCallout
{
float: left;
position: relative;
width: 170px;
padding: 10px;
margin: 15px 0px 10px 0px;
background: #efefef;
color: #777;
}

#newsletterSignupCallout h2
{
text-transform: uppercase;
text-align: center;
margin: 0;
}

#newsletterSignupCallout p
{

}

#newsletterSignupCallout form
{

}

#newsletterSignupCallout input
{
width: 162px;
padding: 3px;
margin: 2px 0px;
border: 1px solid #ccc;
color: #777;
}

#newsletterSignupCallout a.submitButton
{
display: block;
padding: 0px;
font-size: 18px;
text-decoration: none;
font-weight: 700;
color: #FFF;
width: 166px;
height: 32px;
line-height: 32px;
text-align: center;
margin: 8px 0px 0px 2px;
border: none;
cursor: pointer;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px 0px no-repeat;
}

#newsletterSignupCallout a.submitButton:hover
{
color: #9957c5;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px -32px no-repeat;
}


/* Donate Callout Styling */

#donateCallout
{
float: left;
position: relative;
width: 140px;
padding: 15px 25px 5px;
margin: 15px 0px 10px 0px;
background: #9957c5;
color: #FFF;
}

#donateCallout h2
{
font-family: 'Muli', sans-serif;
font-weight: 900;
font-size: 24px;
color: #fff;
text-align: center;
margin: 0;
text-transform: uppercase;
}


#donateCallout h2
{

}

#donateCallout p
{

}

#donateCallout a.dontateButton
{
display: block;
font-size: 18px;
text-decoration: none;
font-weight: 700;
color: #777;
width: 166px;
height: 34px;
text-align: center;
line-height: 34px;
margin: 0px 0px 0px -13px;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px -30px no-repeat;
}

#donateCallout a.dontateButton:hover
{
color: #9957c5;
}

/* Related Links Callout */


#relatedLinksCallout
{
float: left;
position: relative;
width:188px;
padding: 0px;
margin: 15px 0px 5px 0px;
border: 1px solid #efefef;
color: #777;
}

#relatedLinksCallout h4
{
text-transform: capitalize;
text-align: left;
margin: 0;
background: #efefef;
padding: 10px;
font-size: 14px;
font-weight: normal;
color: #9957c5;
}


#relatedLinksCallout ul
{
margin: 10px;
padding: 0px 0px 0px 10px;
}

#relatedLinksCallout ul li
{
margin: 8px 0px;
}

#relatedLinksCallout ul li a
{
font-weight: 700;
color: #777;
}

#relatedLinksCallout ul li a:hover
{
color: #16adb6;
}

#relatedLinksCallout p
{
margin: 15px 20px 10px;
}

/* Purple Corners */


.topRightPurple
{
position: absolute;
top: 0;
right: 0;
}

.bottomRightPurple
{
position: absolute;
bottom: 0;
right: 0;
}

.topLeftPurple
{
position: absolute;
top: 0;
left: 0;
}

.bottomLeftPurple
{
position: absolute;
bottom: 0;
left: 0;
}


/* Footer Styling */

#footerContainer
{
float: left;
position: relative;
width: 100%;
padding: 50px 0px 200px 0px;
background: #efefef url(https://www.meningitis.org.nz/images/templates/footer_tile.png) top center repeat-x;
text-align: center;
}

#copyright
{

}

#copyright p
{
color: #a2a2a2;
}

#copyright p a
{
color: #a2a2a2;
text-decoration: none;
}




/* Form Element Styling ------------------------*/


#emailForm table,
#subscribeForm table
{
float: left;
width: 100%;
background: none;
border: none;
border-top:  none;
padding: 20px 0px 10px 0px;
margin: 0px 0px -5px 0px;
}

#subscribeForm
{
width: 98%;
}


#subscribeForm td
{
text-align: left;
}

#emailForm td.labelHorizontal,
#subscribeForm td.labelHorizontal,
#emailForm td.labelVertical,
#subscribeForm td.labelVertical
{
width: 45%;
vertical-align: top;
padding: 0 5% 0 0 ;
font-weight: bold;
color: #74379c;
}

#emailForm td.valueHorizontal,
#subscribeForm td.valueHorizontal
{
width: 50%;
vertical-align: top;
text-align: right;
}

#emailForm td.valueHorizontal .fgroup,
#subscribeForm td.valueHorizontal .fgroup
{
font-size: 11px;
}

#emailForm td.valueVertical table.fgroup,
#subscribeForm td.valueVertical table.fgroup
{
float: right;
}

#emailForm td.valueVertical table.fgroup td,
#subscribeForm td.valueVertical table.fgroup td
{
padding: 2px 5px;
font-size: 11px;

}

#emailForm input.fmtxt,
#emailForm input.fstxt,
#subscribeForm input.fmtxt,
#subscribeForm input.fstxt
{
background: #FFF;
border: 1px solid #ccc;
font-size: 11px;
padding: 4px;
width: 280px;
}

#emailForm select.fsel,
#emailForm select.fsel,
#subscribeForm select.fsel,
#subscribeForm select.fsel
{
background: #FFF;
border: 1px solid #ccc;
font-size: 11px;
padding: 4px;
width: 290px;
}


#emailForm textarea.fmtxt,
#subscribeForm textarea.fmtxt
{
background: #FFF;
border: 1px solid #ccc;
font-size: 11px;
padding: 4px;
width: 280px;
min-height: 200px;
font-family: Arial;
}


.share_your_story #emailForm textarea.fmtxt,
.share_your_story #subscribeForm textarea.fmtxt
{
width: 450px;
}

#emailForm input.fmtxt:hover,
#emailForm input.fstxt:hover,
#emailForm textarea.fmtxt:hover,
#emailForm input.fmtxt:focus,
#emailForm input.fstxt:focus,
#emailForm textarea.fmtxt:focus,
#subscribeForm input.fmtxt:hover,
#subscribeForm input.fstxt:hover,
#subscribeForm textarea.fmtxt:hover,
#subscribeForm input.fmtxt:focus,
#subscribeForm input.fstxt:focus,
#subscribeForm textarea.fmtxt:focus,
#emailForm select.fsel:hover,
#emailForm select.fsel:focus,
#subscribeForm select.fsel:hover,
#subscribeForm select.fsel:focus
{
background: #fff;
border: 1px solid #34C8E4;
}

#emailForm .buttonBar
{
text-align: right;
padding: 15px 0px 0px 0px;
}

#subscribeForm .buttonPanel
{
text-align: right;
padding: 0px 0px 0px 0px;
}

#emailForm .buttonBar input,
#subscribeForm .buttonPanel input
{
display: block;
padding: 5px 0px 8px;
font-size: 18px;
text-decoration: none;
font-weight: 700;
color: #FFF;
width: 166px;
height: 32px;
float: right;
text-align: center;
margin: 8px 0px 0px 2px;
border: none;
cursor: pointer;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px 0px no-repeat;
}

#emailForm .buttonBar input:hover,
#subscribeForm .buttonPanel input:hover
{
color: #9957c5;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px -32px no-repeat;
}



/* Sitemap Styling */

#siteMap a
{
color: #777;
}



/* Personal Stories Styling */

/* Listing */

.moduleItemsListingPersonalStories
{
float: left;
position: relative;
}

.moduleItemsListingPersonalStories .moduleItemsListingItem
{
float: left;
position: relative;
width: 120px;
}

.moduleItemsListingPersonalStories .moduleItemContent
{
display: none;
}


.moduleItemsListingPersonalStories .moduleItemImage
{
width: 120px;
height: 117px;
margin: 0px 0px 5px -7px;
background: url(https://www.meningitis.org.nz/images/style/personal_story_bg_listing.png) top left no-repeat;
}

.moduleItemsListingPersonalStories .moduleItemImage img
{
margin: 6px 0px 0px 6px;
}


/* Details */

.moduleItemPersonalStories .moduleItemImage
{
float: right;
position: relative;
width: 230px;
height: 225px;
margin: 0px -30px 10px 50px;
background: url(https://www.meningitis.org.nz/images/style/personal_story_bg.png) top left no-repeat;
}

.moduleItemPersonalStories img.main
{
float: left;
margin: 10px 0px 0px 14px;
}


/*-----Latest News Module --------------------*/
#navBar
{
float: left;
position: relative;
width: 100%;
display: block;
margin: 10px 0px 0px 0px;
padding: 20px 0px;
border-top: 1px solid #CCC;
}

span.navheaders
{
font-size: 16px;
font-weight: normal;
}


.moduleItemsListingNewsAndAnnouncements



{

}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem
{
float: left;
position: relative;
width: 100%;
border-top: 1px solid #ccc;
padding: 15px 0px 0px 0px;
margin: 0px 0px 15px 0px;
}


.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem:first-child
{
border-top: none;
}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .moduleItemImage
{
float: left;
position: relative;


}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .moduleItemImage a img.thumbnail
{
margin: 0px 15px 0px 0px;
}


.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .header
{

}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .title
{
display: block;
padding: 0px 0px;
font-size: 16px;
font-weight: normal;
}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .date
{
margin: 0px 0px 10px 0px ;
font-size: 11px;
}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .moduleItemContent
{
line-height: 18px;
margin: 12px 0px;
}

.moduleItemsListingNewsAndAnnouncements .moduleItemsListingItem .readMore a
{

}

/* Details */

.moduleItemNewsAndAnnouncements
{

}


.moduleItemNewsAndAnnouncements .title
{
display: block;
padding: 0px 0px;
font-size: 16px;
font-weight: normal;
}

.moduleItemNewsAndAnnouncements .date
{
font-size: 12px;
}

.moduleItemNewsAndAnnouncements #moduleItemContent
{

}

.moduleItemNewsAndAnnouncements #moduleItemContent .moduleItemImage
{

}

.moduleItemNewsAndAnnouncements .moduleItemImage img.main
{
float: left;
margin: 15px 15px 15px 0px;
}

.moduleItemNewsAndAnnouncements #moduleItemBack
{
position: relative;
float: left;
width: 191px;
height: 16px;
background: #FFFFFF;
text-align: left;
text-indent: 0px;
}

.moduleItemNewsAndAnnouncements #moduleItemBack a
{
color: #FFF;
text-decoration: none;
}


/* Document Library Styles */

#documentLibraryItems
{
border: 1px solid #9957C5;
float: left;
width: 468px;
position: relative;
margin: 5px 0px 0px 0px;
}

.documentLibraryItem
{
float: left;
position: relative;
width: 468px;
background: #efefef;
padding: 0px 0px 5px 0px;
}



.documentLibraryItem .title
{
float: left;
position: relative;
width: 254px;
display: inline-block;
padding: 5px;
}

.documentLibraryItem .size
{
float: left;
position: relative;
width: 60px;
padding: 5px;
text-align: center;
}

.documentLibraryItem .icon
{
float: left;
position: relative;
width: 100px;
padding: 5px;
font-size: 11px;
text-align: center;
}

.documentLibraryItem .icon img
{
margin: 0px 0px -3px 0px;
}

.documentLibraryItem.heading
{
background: #9957C5;
color: #FFF;
}

.documentLibraryItem.heading .title
{
padding-bottom: 0px;
}

.documentLibraryItem.heading .size
{
padding-bottom: 0px;
}

.documentLibraryItem.heading .icon
{
padding-bottom: 0px;
}

.documentLibraryItem .description
{
float: left;
position: relative;
width: 544px;
padding: 0px 0px 0px 20px;
color: #666;
}

#listing_form select
{
font-size: 11px;
border: 1px solid #666;
margin: 4px 0px 0px 0px;
}

#categoryNavigation
{
display: none;
}

.contactDisclaimerContainer
{
float: left;
position: relative;
width: 467px;
margin: 10px 0px 0px 0px;
padding: 0px 40px;
}


.podcasts .contactDisclaimerContainer
{
width: 100%;
box-sizing:border-box;
margin:10px 0px 30px 0px;
}

/*------------ Products Module Styles ----------------------------------------------------------*/

.brandListingItem
{
float: left;
position: relative;
margin: 0px 1.5% 10px;
width: 17%;
height: 160px;
overflow-y: hidden;
display:table;
}

.brandListingItem span
{
display:table-cell;
vertical-align:middle;
width: 110px;
height: 160px;
}

.brandListingItem span a img
{
vertical-align:middle;
}

#multipleImageMainPopup
{

margin: 0px 0px 10px 0px;
}

#productDetail #left #multipleImageThumbs img
{

display: none  ;

border: 1px solid #CCC;
margin: 0px 5px 5px 0px;
cursor: pointer;
}


.productPageTitle {font-weight: bold; color:#666; padding: 0; margin: 10px 0px 10px 0px; font-size: 20px; }
.productPath{

    /* category breadcrumbs */
    float:right;
display: block;
width: 100%;
text-align: left;
margin: 10px 0px 15px;

display: none  ;
}

.productPath span{
font-weight: bold;
margin-right: 6px;
}


p.orphan
{
float: left;
margin: 10px 0px;
font-style: italic;
}

.productListingThumb
{
background: #FFF;

}

.productListingItem
{
width: 172px;
height: 250px;
}

.productListingThumb,
.productListingItem a img
{
border: none;
}

.productListingThumb:hover,
.productListingItem a:hover img
{
border: none;
}

.productListingItem div
{
float: left;
position: relative;
overflow: hidden;
width: 173px;
height: 223px;
border: none;
margin: 0px 0px 5px 0px;
}

.productListingItem div:hover
{
border: none;
}

H2.categoryName{

    margin: 5px 0px 15px 0px;
}

H2.categoryName a {

font-size: 14px;
font-weight: normal;
color: #999;
padding: 0px 0px 0px 13px;
}

.support H2.categoryName a {

font-size: 14px;
font-weight: normal;
color: #999;
padding: 0px 0px 0px 0px;
}

H2.categoryName a:hover {

    text-decoration: underline;

}

H2.productName {
    margin: 5px 0px 15px 0px;
}


H2.productName a {

    font-weight: normal;
    color: #58585A;
    text-decoration: none;
    font-size: 11px;
    padding: 0px 0px 0px 13px;
}

H2.productDetailName {
    float: left;
    display: block;
    width:100%;
    padding:0px 0px 4px 0px;
    border-bottom: none;
    margin: 0px 0px 0px 0px;
    font-size: 14px;
font-weight: bold;

display: none  ;

.
}


H2.productDetailName span {
    float: right;
}

DIV.productListingItem{





    margin: 10px 5px 15px 0px;
    float:left;
position: relative;

width: 172px;
    text-align:center;

background: none;
}

DIV.productListingItem h2
{
display: block;
margin: 14px 0px 0px 0px;
}

SELECT.productOptions{

    width:15em;
}

.productOptionText{
/* single-value attributes[single-type SELECTS, textfields, text boxes] */

    width:15em;
}
.productOptionHeader{

    font-weight:bold;
}

.productPrices{

    padding:0 0;
}

.productCartLink a{

    text-decoration:none;
}

SPAN.productPrice, SPAN.productSpecialPrice{


    color:#666;
}

SPAN.productPrice
{
text-decoration: none;
margin-left: 0px;
 color:#666;
font-size: 26px;
font-weight: normal;
}

#noStrike.productPrice
{
text-decoration: none;
font-size: 26px;
font-weight: normal;
margin: 10px 0px;
}

#productPrice span .productPrice{
text-decoration: line-through;
font-size: 20px;
}

#productPrice .productSpecialPrice
{
text-decoration: none;
font-size: 26px;
font-weight: normal;
margin: 10px 0px;
color: #F1A2CD;
}

DIV.productBackLink{

    margin: 15px 0px 0px 0px;
    float:left;
color: #ccc;

display: none  ;


}

DIV.productBackLink a {

    color: #F15922;
}

#relatedProductsContainer
{
float: left;
position: relative;
width: 100%;
margin: 20px 0px 0px 0px;
}

#relatedProductsContainer p
{
margin: 0;
}

#relatedProducts
{

}

.relatedProduct
{
float: left;
position: relative;
width: 30%;
margin: 20px 5px 0px 5px;
text-align: center;
font-size: 11px;
}

.relatedProduct a
{
clear: both;
display: block;
font-weight: bold;
}

.relatedProduct img
{
margin: 0px 0px 8px 0px;
}


DIV#productCartComponent{


/* Main cart status container */
    text-align:center;
    background:#d3b597;
    padding:1em;

    margin-bottom:1em;
}

DIV#productCartComponent H3 a{

/* component header - link to cart page */
    font-size:10pt;
    font-weight:bold;
    color:#666;
}

DIV.productCartComponentStatus{
/* info line in component */
}

DIV.productCartComponentStatus, DIV.productCartComponentStatus a{

    color:#666;
}

SPAN#productCartComponentItems{
/* num items in component */
}

SPAN#productCartComponentValue{
/* $total in component */
}


/* popup on product detail screen after cart addition */
DIV#productDetailCartStatusBox{
    background-color:#efefef;
    color:#666;
    border: #ccc 1px solid;
    position:absolute;
top: 0px;
right: 0px;
z-index: 100;
    padding:10px;
    text-align:right;
    display:none;
width: 350px;
}
DIV#productDetailCartStatusBox DIV.header{
    padding:5px;
    text-align:left;
    background-color:#fff;
    border-bottom:none;
font-weight: bold;
}
DIV#productDetailCartStatusBox DIV.footer A{
    font-weight:bold;
    text-decoration:underline;
}
DIV#productDetailCartStatusBox P{
    margin:0;
}
DIV#productDetailCartStatusBox P.title{
    color:#666;
    font-size:11px;
    font-weight:normal;
text-align: left;

font-family: Lucida Sans, arial;
border: none;

}

DIV#productDetailCartStatusBox DIV.items{
    background-color:#fff;
max-height: 282px;
overflow-y: scroll;font-size: 11px;
font-family: Lucida Sans, arial;
text-align: left;
}
DIV#productDetailCartStatusBox DIV.closeIcon{
    float:right;
margin: -3px -3px 0px 0px;
}
DIV#productDetailCartStatusBox .cartItems TR{
    border-bottom: none;
}

DIV#productDetailCartStatusBox .cartItems TD.image{
    padding: 4px 0px 4px 8px;
    vertical-align:middle;
}
DIV#productDetailCartStatusBox .cartItems TD.info{
    vertical-align:top;
    text-align:left;
    padding:10px;
}
DIV#productDetailCartStatusBox .cartItems p.price SPAN{
    font-weight:bold;
}
DIV#productDetailCartStatusBox .cartItems P.price span.wrapping_note{
font-size: 10px;
font-weight: normal;
line-height: 12px;
}
DIV#productDetailCartStatusBox DIV.total{
    border-bottom:1px dashed #999;

    font-weight:bold;
padding: 15px 0px;
margin-bottom: 15px;
}





TABLE#productCartForm{ padding: 20px 0px 0px 0px ; border-top: 1px dotted #666;}


TABLE#productCartForm input,
#blank TABLE#editComment input
{
background: #EFEFEF;
border: none;
color: #666;
font-size: 11px;
padding: 4px;
width: 250px;
font-family: Lucida Sans, arial;
}

TABLE#productCartForm .horizontalElementsubscribe input
{
background: #eee;
border: 1px solid #333;
color: #666;
font-size: 11px;
padding: 4px;
width: 20px;
font-family: Lucida Sans, arial;
}

TABLE#productCartForm textarea,
#blank TABLE#editComment textarea {

background: #EFEFEF;
border: none;
color: #666;
font-size: 11px;
padding: 4px;
font-family: Lucida Sans, arial;
width: 250px;}

TABLE#productCartForm select {
background: #EFEFEF;
border: none;
color: #666;
font-size: 11px;
padding: 4px;
width: 250px;
font-family: Lucida Sans, arial;
}


TABLE#productCartForm input:hover,
TABLE#productCartForm textarea:hover,
TABLE#productCartForm select:hover,
TABLE#productCartForm input:focus,
TABLE#productCartForm textarea:focus,
TABLE#productCartForm select:focus,
#blank TABLE#editComment input:hover,
#blank TABLE#editComment input:focus,
#blank TABLE#editComment textarea:hover,
#blank TABLE#editComment textarea:focus, {
font-family: Lucida Sans, arial;
    border: 1px solid #ccc;
}

DIV#productCartContainer{padding: 10px 0px 0px 0px;}

DIV#productCartContainer h2 {

    font-size: 13px;

    margin: 0px 0px 15px 0px;

    padding: 0;
    font-weight: bold;
    color: #666;
}

DIV#productCartContainer #productCartFormHeaderText {

    border-top: 1px solid #666;
    margin: 17px 0px 0px 0px;
    padding: 10px 0px 0px 0px;
}


DIV#productCartFormHeaderText{

    font-weight:bold;
}

DIV#productCartContainer .productUsageText{

    font-size: 11px;
    font-weight: normal;
    background: none;
    border: 1px dashed #666;
    margin: 0px 0px 8px 0px;
    padding: 10px;
    width: 623px;
}


DIV#productCartContainer .viewCartItem{
width: 50%;
height: auto;
float: left;
position: relative;
    font-size: 11px;
    margin: 0px 0px 10px 0px;
    padding: 0;
    font-weight: bold;
    color: #666;
}


DIV#productCartContainer .viewCartItem p{
margin: 0;
}

DIV#productCartContainer .viewCartItem h3,
DIV#productCartContainer .confirmCartItem h3{

    font-size: 11px;
    margin: 0px 0px 0px 0px;
    padding: 0;
    font-weight: bold;
    color: #666;
}

DIV#productCartContainer .viewCartItem img {

    margin: 10px 10px 0px 0px;
    border: none;
}

DIV#productCartContainer .viewCartItem p.cartItemFields {

    margin: 0;
    padding: 0;
}


DIV#productCartContainer .viewCartItem p.cartItemPrice{

    margin: 10px 0px 0px 0px;
    padding: 0;
}


DIV#productCartContainer .viewCartItem p.cartItemQuantity{

    margin: 0;
    padding: 0;
}


DIV#productCartContainer .viewCartItem span.wrapping_note{
color: #666;
font-weight: normal
}

#accountDetails,
#coupon,
#productCartForm
{
float: left;
position: relative;
width: 100%;
float: left;
background: #FFF;
border: none;
padding: 10px 10px;
margin: 0;
}

#accountHeader
{
float: left;
position: relative;
width: 97%;
float: left;
background: #FFF;
border: none;
padding: 10px 10px 0px;

}

#productCartForm td
{
padding-left: 10px;
}


#accountHeader.header p
{
font-size: 16px;
font-weight: bold;
color: #666;
margin: 15px 0px 0px;
}

#accountDetails.header p,
#coupon .header p
{
font-size: 16px;
font-weight: bold;
color: #666;
margin: 15px 0px;
}

DIV#productCartContainer .viewCartItem a.delete{}

TD.productCartLabel{
vertical-align:top;
text-align:right;
}
TD.productCartFormVerticalElement{ }
TD.productCartFormVerticalName{  }
TD.productCartFormHorizontalElement{ }
TD.productCartFormHorizontalName{  width: 30%}

DIV.productCartFormCheckoutButtons {


    float:right;
    padding: 1em 0;
    margin: 0px 0px 0px 10px;
}


DIV.productCartFormCheckoutButtons a img {

    display: inline-block;
    float: left;
    width: auto;
}

A.productCartFormCheckoutButton{  }
A.productCartFormCheckoutButton{  }

#productDetail {

    float: left;
    width:100%;
}

#productDetail #left #detailImage{

min-height: 400px;
display: none  ;
}

#productDetail #left {

/* left hand column of product Details page */
    float: left;
position: relative;
    width: 100%;
min-height: auto;
}

#productDetail #left p {
font-family: arial;
text-align: left;
font-weight: normal;
margin: 10px 0px 30px 0px;

}


#productDetail #left img {

    border: none;
margin: 0px 0px 20px 0px;

display: none  ;
}


#productDetail #left a.fancybox {
display: none  ;
    border: 1px solid #58585A;
}

#productDetail #left a.fancybox img:hover{

    border: none;
}

#left a.fancybox {




    display: block;
    text-decoration: none;
    margin: 3px 0px 0px 0px;
}

#productDetail #left a.fancybox:hover {

    text-decoration: underline;
}

#productDetail #left a.fancybox img {

    margin: 0px 0px -2px 0px;
    border: none;
}


#productDetail .productDetailBackground
{
float: left;
position: relative;
width: 327px;
padding: 22px 0px 0px 25px;
margin: 0px 10px 35px -10px;
}

#productDetail .productDetailBgBottom
{
position: absolute;
margin: 0px 0px 0px -26px;
}

#productDetail #right {

    float: left;
    width: 100%;
    margin: 0px 0px 0px 0px;
}

#productDetail #right .addToCartButton {
display: block;
float: left;
clear: both;
text-indent: 30px;
line-height: 30px;
margin: -10px 0px 0px 0px;
text-decoration: none;
}

#productDetail #right .addToCartButton:hover {
}

DIV#colourSwatch{

    padding:3px;
    width:300px;
    margin:0.5em 0;
}

DIV.swatchItem{

    border:none;
    height:30px;
    width:30px;
    background:#eee;
    float:left;






    margin:4px 9px 4px 0px;
}

DIV.swatchItem a img{


    margin: 0;
    padding: 0;
}



.productOptionElement {

    margin: 2px 0px;
}

.productOptionHeader{

    margin: 10px 0px 0px;
}

.productOptionElement select{

    width: 190px;
    font-size: 11px;
    color: #58585A;
    border: 1px solid #58585A;
}


#productFields {

    float: left;
    width: 300px;
    margin: 2px 0px 15px;
}

.productPrices th{

    padding: 0;
    margin: 0;
    border-bottom: 1px solid #ccc;
    background: #fff8f2;
    padding: 4px;
    text-align: left;
}

.productPrices table{

    width: 100%;
    background: #FFF;
    border: none;
}

.productPrices .priceWas, .productPrices .priceSpecial{

    border-bottom: none;
}

.productPrices .price{


    color: #666;

}

.productPrices .priceSpecial{

    color: #666;
    font-weight: bold;
}

.productPrices {
float: left;
clear: both;
    padding: 0;
    margin: 0;
width: 450px;
    background: #EFEFEF;
    border: 1px #CCC solid;
    padding: 17px 20px 0 20px;
    text-align: left;
}


.productPrices p{
    padding: 0;
    margin: 0;
text-align: left;
}

.productPrices p a
{
float: right;
display: block;
padding: 0px;
font-size: 18px;
text-decoration: none;
font-weight: 700;
color: #FFF;
width: 166px;
height: 32px;
line-height: 32px;
text-align: center;
margin: -2px 0px 0px 2px;
border: none;
cursor: pointer;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px 0px no-repeat;
}
.productPrices p a:hover
{
color: #9957c5;
background: url(https://www.meningitis.org.nz/images/style/button_bg.png) 0px -32px no-repeat;
}

.productPrices strong {

    display: block;
    padding: 5px;
    margin: 0px;
    background: #fff8f2;
    border-bottom: 1px solid #ccc;
    margin: 0;
}


.productPrices span.productPrice {

    display: block;
    padding: 5px;
    margin: 0px;
    margin: 0;
    color: #58585A;
}



.confirmCartItem {
float: left;
position: relative;
width: 46%;
margin: 5px 0px 5px 0px;
    border: none;
    padding: 8px 0px 8px 8px;
background: none;

}

#productcartContainer .confirmCartItem p,
#productcartContainer .confirmCartItem h3
 {
margin: 0;
padding: 0;
}

.confirmCartItem img {
margin: 0px 5px 0px 0px;
}

#cart_shipping_totals {

    float: right;
    width: 150px;
    text-align: right;
    border-bottom: 3px double #666;
    padding: 10px 0px 10px 369px;
    margin: 0px 0px 10px 0px;
}


#cart_shipping_totals th {
width: 10%;
    padding: 0px 8px 0px 0px;
}


#shippingTotals,
#cart_shipping_notes,
#userDetails
{
display:block ;
float: left;
width: 645px;
border: 1px dashed #666;
margin: 10px 0px;
padding: 10px;
background: none;
}

#cart_shipping_notes
{
width: 623px;
}

#shippingTotals th
{
width: 25%;
}

#shippingTotals td
{
width: 25%;
}

.productCartFormCheckoutButtonsTop{

    float: right;
    margin: 10px 0px 0px 0px;
}

.productCartFormCheckoutButtonsBottom{

    float: right;
    width: 600px;

    height: 65px;
    position: relative;
text-align: right;
}

.checkoutButtonsBottom
{
float: right;
position: relative;
margin: 0px -180px 0px 0px;
padding: 30px 0px 20px 80px;
text-align: right;
}

.checkoutButtonsBottom a
{
display: block;
width: 150px;
padding: 10px;
background: #efefef;
text-decoration: none;
text-align: center;
}


.checkoutButtonsBottom a:hover
{
background: #9957C5;
color: #FFF;
}


.checkoutButtonsBottom a img
{
border: none;
}


.productCartFormCheckoutButtonsBottom a.productCartFormCheckoutButton {

    position: absolute;
    bottom: 0px;
    left: 0;
}

.productCartFormCheckoutButtonsBottom a.checkout {

    position: absolute;
    top: 35px;
    left: 0px;
}

.productCartFormCheckoutButtonsBottom a.checkoutBottom {

    position: absolute;
    top:0;

    right: 0px;
}

DIV.viewCartItem H3, DIV.confirmCartItem H3{

    padding:0 0 0 0;
    /*color:#666;*/
    margin:0 0 0.5em 0;

    font-weight:bold;

}
DIV.viewCartItem P{

    margin:0;
}


DIV.confirmCartItem P{

    padding:0 0 0 0em;
    margin:0;
}

DIV.confirmCartItem STRONG, DIV.viewCartItem STRONG{

    font-weight:normal;
    color:#666;
}


TABLE#cart_shipping_totals{


    margin-top:1em;
}

TABLE#cart_shipping_totals TD{

    text-align:right;
}

DIV#colourSwatch{

    padding:3px;

    width:190px;
    margin:0.5em 0;
}

DIV.swatchItem{


    border:1px solid #999;
    height:36px;
    width:36px;
    background:#eee;
    float:left;
    margin:5px 5px 5px 4px;
}

#couponContainer,
#couponContainer .header p
{
float: left;
position: relative;
margin: 15px 0px 0px 0px;
padding: 0;
color: #666;
}

#ajaxBusy
{

display: none  ;
}

#customised_price
{
width: 102px;
padding: 3px;
margin: 2px 0px;
border: 1px solid #ccc;
color: #777;
}

.immuneLink{
position:absolute;
top:0px;
right:2px;
display:block;
width:215px;
height:149px;
z-index:1000;
}

.info
{
position:relative;
float:left;
margin:0px 0px 0px 10px;
}

.info p#purple
{
color:#9957C5;
font-weight:bold;
}

a#pull
{
display:none;
}


/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/
/**************************************************/


@media screen and (max-width: 1100px) {

a#pull
{
display:none;
}


}



@media screen and (max-width: 500px) {


#container
{
width: 320px;
}

#bgcontainer
{
width: 320px;
}

#header
{
width: 320px;
height: 156px;
}


#header a.logo img
{
width:280px;
margin:20px 0px 0px 20px;
}

#leftCol
{
width:280px;
padding:0px 20px;
margin:0px;
min-height:50px;
}

#navigation
{
display:none;
}


#aboutTheFoundationCallout,
#personalStoriesCallout
{
display:none;
}

#homeSlidesContainer
{
display:none;
}

#centerCol
{
min-height: 196px;
width: 320px;
}

#pageEditorContainer
{
width: 280px;
padding: 0px 20px;
}


#pageEditorContainer img
{
max-width: 280px;
height:auto;
}


#home #pageEditorContainer
{
width: 280px;
padding: 20px 20px;
margin: 9px 0px;
background:#FFF7EA;
}

#home #pageEditorContainer table
{
width: 280px;
}

#home #pageEditorContainer table td
{
width: 280px!important;
}


#home #pageEditorContainer table td img
{
margin-left:32px!important;
margin-right:20px!important;
margin-bottom:20px;
text-align:center;
}


#home #pageEditorContainer table td h3
{
text-align:center;
font-size:12px;
}


.headerText,
.bottomLeftPurple,
.topLeftPurple
{
display:none;
}

#home #pageEditorContainer .symptomPopup img
{
border:1px solid #999;
}

.bannerText
{
background:#14A4AD;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}

#newsAndEventsContainer
{
width:280px;
padding:0px 20px;
}


.moduleComponentnewsAndAnnouncements .componentItem
{
width:100%;
}

#rightCol
{
display:none;
}


#footerContainer
{
padding:40px 0px 30px 0px;
}

#copyright
{
width:280px;
padding:0px 20px;
}


.contactDisclaimerContainer
{
width:280px;
padding:0px 20px;
}


.moduleItemsListingPersonalStories .moduleItemsListingItem
{
width:120px;
margin-left:10px;
height:160px;
}

.moduleItemPersonalStories .moduleItemImage
{
float:left;
margin:0px 0px 20px 20px;
}


#emailForm table,
#subscribeForm table
{

}


#emailForm table td,
#subscribeForm table td
{
display:block;
width:280px;
}


#emailForm td.valueVertical table.fgroup,
#subscribeForm td.valueVertical table.fgroup
{
float:left;
width:280px;
}


.share_your_story #emailForm textarea.fmtxt,
.share_your_story #subscribeForm textarea.fmtxt
{
width:280px;
}


#emailForm td.labelHorizontal,
#subscribeForm td.labelHorizontal,
#emailForm td.labelVertical,
#subscribeForm td.labelVertical
{
width:280px;
}

.our_sponsors table td
{
display:block;
}


.links table td h3
{
display:none;
}

.links table td
{
display:block;
}



/* Document Library Styles */

#documentLibraryItems
{
width: 280px;
margin: 5px 0px 0px 0px;
}

.documentLibraryItem
{
width: 280px;
padding: 0px 0px 5px 0px;
}

.documentLibraryItem .title
{
width: 270px;
display: inline-block;
padding: 5px;
border-top:1px solid #ccc;
}

.documentLibraryItem .size
{
width: 60px;
padding: 5px;
text-align: center;
}

.documentLibraryItem .icon
{
width: 100px;
padding: 5px;
font-size: 11px;
text-align: center;
}

.documentLibraryItem .icon img
{
margin: 0px 0px -3px 0px;
}

.documentLibraryItem.heading
{
display:none;
}

.documentLibraryItem.heading .title
{
padding-bottom: 0px;
}

.documentLibraryItem.heading .size
{
padding-bottom: 0px;
}

.documentLibraryItem.heading .icon
{
padding-bottom: 0px;
}

.documentLibraryItem .description
{
display:none;
}


.productPrices
{
width:240px;
}


.productPrices p a
{
float:right;
width:120px;
background:#9957c5;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}




/*********************************/

/* Header Navigation */

#leftCol #navigation
{
display:block!important;
position: absolute;
top: 0px;
left:20px;
width:280px;
}


#leftCol #navigation a#pull {
position: absolute;
top: 7px;
left: 0px;
display: inline-block;
width: 270px;
height: 25px;
background:#9957c5;
border-radius:0;
padding: 0;
font-size:22px;
padding:8px 0px 10px 10px;
text-decoration:none;
color:#FFF;
}

#leftCol #navigation a#pull:after {
content:"";
background: url(http://www.mocadev.net/THEGYM/images/style/nav-icon.png) center no-repeat;
background-size: 47% auto;
width: 45px;
height: 45px;
display: inline-block;
position: absolute;
right: 0px;
top: -2px;
}

#leftCol #navigation {
border-bottom: 0;
}

#leftCol #navigation ul {
display: none;
height: auto;
padding: 0;
margin: 0px 0px 0px 0px;
width: 100%;
position: absolute;
z-index: 100;

}

#leftCol #navigation ul {
position: absolute;
top: 50px;
right:0px;
width:280px;
background:#9957c5;
background:rgba(153,87,197,0.9);
}

#leftCol #navigation li {
display: block;
float: none;
width: 100%;
height: 30px;
line-height: 30px;
border:none!important;
border-right:none!important;
}

#leftCol #navigation li a {
color: #FFF!important;
display: block;
font-size: 19px !important;
line-height: 42px!important;
text-decoration: none;
text-indent: 10px;
text-shadow: none;
font-weight: normal !important;
width:85%!important;
float:left;
text-align:left!important;
font-family: 'Roboto', sans-serif;
border-right:none!important;

}

#leftCol #navigation li a:hover {
background:none!important;
color: #fff !important;
}

#header #navigation ul li ul {

display:none!important;
}


#leftCol #navigation ul li:hover ul {
display:none;
}

/*************************************/
}

    .podcastContainerFirst
    {
    float:left;
    position:relative;
    width:100%;
    padding:20px;
    margin:0px 0px 30px;
    box-sizing:border-box;
    }

    .podcastContainer
    {
    float:left;
    position:relative;
    width:100%;
    padding:20px;
    margin:0px 0px 30px;
    background:#f8f8f8;
    box-sizing:border-box;
    }

    .podcastContainer .podcastImage
    {
    width:170px;
    margin-right:20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    }

    .podcastContainer .podcastImage img
    {
    width:100%;
    }

    .podcastContainer .podcastContent
    {
     float:right;
    position:relative;
    width:500px;
    }

    .audiojs
    {
    width:500px!important;
    float:left;
    position:relative;
    }

    .audiojs .play-pause
    {
    width:10%!important;
    box-sizing:border-box;
    }

    .audiojs .scrubber
    {
    width:62%!important;
    box-sizing:border-box;
    }

    .audiojs .time
    {
    width:20%!important;
    box-sizing:border-box;
    }

    #podcastLink
    {
    float:left;
    position:relative;
    width:190px;
    margin-top:10px;
    }

    #podcastLink img
    {
    width:100%;
    }


    @media screen and (max-width: 500px) {

        .podcastContainerFirst
        {
        float:left;
        position:relative;
        width:100%;
        padding:20px;
        margin:0px 0px 30px;
        box-sizing:border-box;
        }

        .podcastContainer
        {
        float:left;
        position:relative;
        width:100%;
        padding:20px;
        margin:0px 0px 30px;
        background:#f8f8f8;
        box-sizing:border-box;
        }


        .podcastContainer .podcastImage
        {
        float:left;
        position: relative;
        top: 0%;
        transform: translateY(0%);
        width: 100%;
        }

        .podcastContainer .podcastImage img
        {
        width:100%;
        }

        .podcastContainer .podcastContent
        {
         float:left;
        position:relative;
        width:100%;
        }

        .audiojs
        {
        width:100%!important;
        }

        .audiojs .play-pause
        {
        width:15%!important;
        box-sizing:border-box;
        }

        .audiojs .scrubber
        {
        width:39%!important;
        box-sizing:border-box;
        }

        .audiojs .time
        {
        width:34%!important;
        box-sizing:border-box;
        }

    }
