/* Fix to accordian */
h4.panel-title{
	margin-top: 12px;
	margin-bottom: -10px;
	}
h4.panel-title a.accordion-toggle{
	font-weight: 700 !important;
}

/* For responsive videos not using the responsive video shortcode */
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */; padding-top: 0px;; height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 1px solid #e3e3e3;
}

.post-navigation {
	display: none !important;
}

.widget ul.sub-menu {
    padding-top: 3px;
    padding-bottom: 0px;
}

.mnave .navbar-nav > li {
    white-space:nowrap !important;
}

/* H1 font correction only on the homepage when two buttons are included */
@media only screen and (min-width: 992px) {
    .home .hero .grid-flex .content .hero-title {
        font-size: 4rem;
        margin-top: 40px;
    }
}

/* ============================================================================================= 
================================================================================================ 
==================================Styles added in the 2024 Refresh==============================
================================================================================================
================================================================================================*/
/* ovwerites the default h1 style for mobile sizes */
@media (max-width: 768px){
  h1 {
    font-size: 30px;
  }  
}

/* ovwerites the default h2 style */
h2 {
    font-size: 24px;
}
/* overwrites the h3 styles to not have a bolder look */
h3 {
    font-family: "Futura-Mediaum", "Arial", sans-serif;
    font-size: 22px;
    line-height: 1.34;
}
/* overwrites the p font size to use px instead of rem as the latter is ignored by some browsers */
p {
	font-size: 16px;
}

/* overwrites some pre-header styles */
@media only screen and (min-width: 992px) {
    #global-header .pre-head .pre-head-menu {
        text-align: left;
    }
    #global-header .pre-head {
        /*font-size: 1.5rem;*/
        padding: 1.2rem 2rem;
    }    
}

#global-header .pre-head .pre-head-menu {
    /*text-align: center;
    width: 100%;*/
    max-width: 1560px;
    margin: 0 auto;
}

/* this hides the box shadow at the mobile size */
@media (max-width: 991px) {
  #mega-menu-wrap-professionals-nav #mega-menu-professionals-nav > li.mega-menu-megamenu > ul.mega-sub-menu {
    box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.0);
  }
}
/* this centers the longer links on mobile devices */
@media only screen and (max-width: 630px) {
  #global-header .pre-head .pre-head-menu {
		width: 70%;
  }  
    #global-header .pre-head {
        font-size: 12px;
        display: block;
        padding: 1.5rem 2rem;
    }
}
  
/* this sets the max-width for the max mega menu */
#mega-menu-wrap-professionals-nav,
#mega-menu-wrap-main-nav {
	  width: 100%;
	  max-width: 1600px;
	  margin: 0 auto;
	  padding: 0 10px;
}

/* you can change the content width below */
.core-block, .block-core {
    max-width: 1600px;
}
.breadcrumbs.container {
    max-width: 1600px;
}
.banner-component .banner-form-container {
    max-width: 1600px; /* you can adjust the newsletter form max-width with this value */
}
/* added red button styles for custom Lazy Blocks */
.mybutton {
    background-color: #FFFFFF !important;  
    border: 1px solid #C10E21 !important;
    color: #C10E21 !important;
    font-family: "Futura-Bold", "Arial", sans-serif !important;
    font-size: 15px;
    border-radius: 50px; 
    padding: calc(.667em + 2px) calc(1.333em + 2px);
    text-decoration: none !important;
}
.mybutton:hover {
    background-color: #C10E21 !important;
    color: #FFFFFF !important;
    border: 1px solid #C10E21 !important;
}

@media (max-width: 430px) {
  .mybutton {
    font-size: 13px;
  }
}
/* overwrites the templates uppercase style */
.button {
	  text-transform: inherit !important;
}
/* overwrites the templates font size */
.button, a.button {
    font-size: 15px !important;
}

/* added red button styles for Spanish site */
.button-es {
    background-color: unset;  
    border: 1px solid #FFFFFF !important;
    color: #FFFFFF !important;
    font-family: "Futura-bold", "Arial", sans-serif !important;
    font-size: 15px;
    border-radius: 50px; 
    padding: 5px 15px !important;
    text-decoration: none !important;
    float: right;
    margin-top: -6px;
}
.button-es:hover {
    background-color: #FFFFFF !important;
    color: #C10E21 !important;
    border: 1px solid #FFFFFF !important;
}
.button-es::after {
    content: "";
    width: 0;
    height: 0;
    margin-left: 0.55em;
    margin-right: 0.55em;
    vertical-align: 0.1em;
    border: solid;
    border-width: 0 1.5px 1.5px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transition: all 0.5s ease;
    margin-top: 2px;
}

/* these classes will hide/show things on desktop or mobile */
.desktop-only {
	  display: inline !important;
}
.mobile-only {
	  display: none !important;
}
.marginMMenuLink {
  margin-top: 30px !important;
}
@media screen and (max-width: 991px) {
	.button-es {
		display: none;
	}  
	.mobile-only {
		display: inline !important;
	}
  .desktop-only {
	  display: none !important;
  }	
	/* this specifically targets the blank line above the Infographics/PDfs link in the mobile menu */
	.mega-sub-menu #mega-menu-item-custom_html-27 .textwidget.custom-html-widget,
	.mega-sub-menu #mega-menu-item-custom_html-38 .textwidget.custom-html-widget {
		padding: unset;
		margin-top: -20px;
	}  
}
/* overwrites the font weight on the hero button */
.hero .grid-flex .content .button {
    font-weight: 400;
}
 
/* overwrites some button styles */
/*.page-template-default .kadence-column.core-block,
.page-template-default .kadence-column.block-core {
	  margin:0;
}*/
.page .kadence-advancedheading.core-block,
.page .core-heading.core-block {
	  margin:0;
}
.page .kadence-advancedbtn.core-block,
.kadence-singlebtn.core-block {
	  margin:0;
}
.kadence-singlebtn.core-block .button {
	  font-weight: normal;
}

/* overwrites the default HR tag */
.wp-block-separator {
    border: 1px solid #d7d7d7;
    border-left: none;
    border-right: none;
    border-top: none;
}

/* overwrites the h2 to not use BOLD by default */
h2 {
    font-family: "Futura", "Arial", sans-serif !important;
}

/* this forces an inner block to extend the full-width of the outside container */
.makefullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
}

/* styles to add margin to header logos on the righ side */
.logo-addmargin {
	  margin-left: 40px;
}

/* overwrites the header max-width and adds some padding the right of the ADA logo */
#global-header .site-branding .site-branding-container {
    max-width: 1600px;
    padding: 0 20px;
}

/* ovwrites the inline style automatically added by the  group block */
.nopadmobile {
	  padding-top: 2em !important;
	  padding-right: 2em !important;
	  padding-left: 2em !important;
	  padding-bottom: 2em !important;
}
  
@media only screen and (min-width: 992px) {
	.hero .grid-flex .content .hero-title {
		font-size: 40px;
	}
}  
/* mobile style fixes */
@media (max-width: 1024px) {
	.hero .grid-flex .content p {
		    font-size: 16px;	
	}
}
@media (max-width: 768px) {
  /* this removes the shadow in the mega menu on mobile only */
	#mega-menu-wrap-main-nav #mega-menu-main-nav > li.mega-menu-megamenu > ul.mega-sub-menu {
		padding: 20px 0px 40px 0px;
		box-shadow: none;
	}
}
@media (max-width: 768px) {
	.hero .grid-flex .content {
		/*padding: 2rem 3rem 3.5rem;
		font-size: 38px;*/
		text-align: left !important;
	}
	.hero .grid-flex .content .hero-title {
		font-size: 30px !important;
		line-height: 1.24;
		font-family: "Futura-Bold", "Arial", sans-serif;
		margin: 0;
	}
	/* removes the padding left and right on mobile for the quote blocks */
	.nopadmobile {
		padding-top: 2em !important;
		padding-right: 0px !important;
		padding-left: 0px !important;
		padding-bottom: 2em !important;
		margin-left: -8%;
		margin-right: -8%;
	}
}

/* overwrites some search bar styles in the main navigation */
#global-header .search {
    max-width: 1560px; /* forces the search bar to take the full width */
    display: none;
}
#global-header .search .search-form .search-form__input {
    margin-left: unset; /* removes unwated margin */
    margin: auto;
}
#global-header .search .search-form .searchbox-icon {
    right: 5px; /* changes the postion of the serach icon and close button */
}

/* fixes to short-hero banners with only Headers and text
an image can be added but the cropping may be a bit tight */
@media only screen and (min-width: 821px) {
    .hero.short-hero .grid-flex {
        height: 35rem;
        max-width: 1600px;
        margin: auto;
    }
}
@media only screen and (min-width: 768px) {
    .hero.short-hero .grid-flex .content {
        text-align: left;
        padding: 2rem 1.3% 2rem 1.3%;
    }
}

/* quick link styles - you can style the quicklinks by adding the stickyme class the to the main block */
.kadence-column.core-block .wp-block-kadence-column.stickyme {
    max-width: 500px !important;
    float: right !important;
    font-size: 14px;
    margin-top: -150px;
}

.stickynomargin {
    margin-top: 0px !important;  
}
.stickyme .core-block, .block-core {
    margin: unset;
}

.stickyme a:hover {
    text-decoration: underline;    
    cursor: pointer;
}
.stickyme a::after {
    content: "";
    width: 0;
    height: 0;
    margin-left: 0.55em;
    margin-right: 0.55em;
    vertical-align: 0.1em;
    border: solid;
    border-width: 0 1.5px 1.5px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transition: all 0.5s ease;
    margin-top: 2px;
}

@media all and (max-width: 960px) {
  .kadence-column.core-block .wp-block-kadence-column.stickyme {
    max-width: 100% !important;
    margin-top: 30px;
    float: left;
    width: 100%;
    }
}
/* end quick links styles */

/* adding the classes left-roud-edge or right-round-edge will round the images on some custom patterns */
.left-round-edge .wp-block-media-text__media {
    border-radius: 23px 0 0 23px;
}
.right-round-edge .wp-block-media-text__media {
    border-radius: 0 23px 23px 0;
}

@media (max-width: 600px) {
  .left-round-edge .wp-block-media-text__media {
    border-radius: 0 0 0 0;
    margin-top: 20px;
  }
  .right-round-edge .wp-block-media-text__media {
    border-radius: 0 0 0 0;
    margin-top: 20px;
  }  
}
/* end some custom pattern fixes */

.singlefeature .myfea-section{
    flex-basis: 100%; /* by adding the .singlefeature class it forces a feature block to display one column instead of the default three */
}

.doublefeature .myfea-section{
    flex-basis: 45%; /* by adding the .doublefeature class it forces a feature block to two display two columns instead of the default three */
}

/* breadcrumb style adjustments */
.breadcrumbs.container ul {
    font-size: 12px;
    color: #595959;
    margin-top: 25px;
}

.breadcrumbs.container ul li,
.breadcrumbs.container ul li a {
    color: #595959;
}

@media only screen and (min-width: 768px) {
    .breadcrumbs ul li span::after {
        content: "/"; /* changes the vertical bracket | to a forward slash / */
        padding: 0 1rem;
    }
    .bread-divider {
        display: block;
        border-bottom: 0px solid #EDF0F4; /* removes the bottom divider from the breadcrumbs */
    }    
}
/* end breadcrumb style adjustments */

/* with these classes the focal point on the featured blocks can be overwritten */
.changeIMGfocal-top .twothirds-image-alt img {
    background-position: center top;
}

.changeIMGfocal-bottom .twothirds-image-alt img {
    background-position: center bottom;
}

/* hides the corona banner that displayed after removing the Bayer logo from the footer */
    .gab {
        background-color: #007889;
        color: #FFFFFF;
        display: none !important;
    }

/* use this in case padding is needed on smaller screens */
@media (max-width: 1200px) {
  .paddme20 {
    padding-right:20px;
    padding-left: 20px;
  }
}

.single-post .core-block,
.single-ambassadors .core-block,
.single-recipes .acf-recipes,
.single-podcast .acf-podcast,
.single-webinars .acf-webinars,
.single-ask .acf-ask,
.single-recipes .acf-recipes .container,
.single-podcast .acf-podcast .container,
.single-webinars .acf-webinars .container,
.single-ask .acf-ask .container,
.single-videos .core-block {
  max-width: 1200px; /* this modifies the default width on third level pages */
}

.single-healthlesson .acf-breadcrumbs,
.single-flyer .acf-breadcrumbs,
.single-elearning .acf-breadcrumbs,
.single-casestudy .acf-breadcrumbs,
.single-clinicaltools .acf-breadcrumbs {
  max-width: 1600px; /* sets the max-width for breadcrubmb if needed */
}
.single-healthlesson section,
.single-flyer section,
.single-elearning section,
.single-casestudy section,
.single-clinicaltools section {
  max-width: 1200px; /* sets the max-width if needed */
  margin: 0 auto;
}
.single-healthlesson .kadence-advancedbtn.core-block,
.single-healthlesson .core-heading.core-block,
.single-flyer .kadence-advancedbtn.core-block,
.single-flyer .core-heading.core-block,
.single-healthlesson .core-paragraph.core-block{
  margin: unset; /* removes unwanted margin on advanced buttons if needed */
}

/* style to reduce the line height on bulleted list */
ul .core-list-item.core-block li {
  line-height: 1.2;
}

@media (min-width: 992px) {
  /* this adds the solid bar above the consumer nav link */
  .consumer .pre-head a.consumer-link {
    content:"";
    border-top: 5px solid;
  }

  /* this adds the solid bar above the professional nav link */
  .professional .pre-head a.professional-link {
    content:"";
    border-top: 5px solid;
  }

  /* this padding positions the solid bar above the links */
  #global-header .pre-head .pre-head-menu a {
    padding: 9px 0.5rem;
  }
}

/* overrides some old block styles */
@media only screen and (min-width: 768px) {
  /*.single-post .container .podcast .grid-flex, 
  .single-ambassadors .container .podcast .grid-flex, 
  .single-recipes .container .podcast .grid-flex, 
  .single-webinars .container .podcast .grid-flex, 
  .single-ask .container .podcast .grid-flex, 
  .single-videos .container .podcast .grid-flex, 
  .single-downloads .container .podcast .grid-flex,*/
  .single-podcast .container .podcast .grid-flex {
    justify-content: space-between; /* spaces the columns evenly */
  }
  /*.single-post .container .podcast .grid-flex .grid__item, 
  .single-ambassadors .container .podcast .grid-flex .grid__item, 
  .single-recipes .container .podcast .grid-flex .grid__item, 
  .single-podcast .container .podcast .grid-flex .grid__item, 
  .single-webinars .container .podcast .grid-flex .grid__item, 
  .single-ask .container .podcast .grid-flex .grid__item, 
  .single-videos .container .podcast .grid-flex .grid__item,
  .single-downloads .container .podcast .grid-flex .grid__item,*/ 
  .single-podcast .container .podcast .grid-flex .grid__item {
    flex-basis: 45%; /* changes the flex-basis */
  }
}

/* Start share icons on page template only */
/* this displays the icon in a row */
.page .acf-social.core-block .share-container .share-buttons{
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding: 0;
}

 /* this hides the red default bullets */
.page .acf-social.core-block .share-container ul li::before {
  display: none;
}

/* this adds padding right between the list items */
.page .acf-social.core-block .share-container ul li {
  padding-right: 20px;
}

/* this makes the "Share" label bold */
.page .acf-social.core-block .share-container ul li:first-child {
  font-weight: 700;
}

/* this makes the share container fill the full width */
@media only screen and (min-width: 768px) {
    .page .acf-social.core-block .share-container.max-width-detail,
    .single-post .acf-social.core-block .share-container.max-width-detail{
        max-width: 120rem;
        margin: 0 auto;
    }
}

.menuLinkHidden {
  display: none !important;
}
/* End share icons on page template only */


/* List of special classes that can be added to blocks
stickyme 
left-round-edge 
right-round-edge
nopadmobile
makefullwidth
singlefeature
doublefeature
changeIMGfocal-top
changeIMGfocal-bottom
paddme20
desktop-only
mobile-only
menuLinkHidden
*/

/* Hash bar fix - this forces the content to display full width */
.hthb-notification-content.ht-notification-text .core-block {
  max-width: 100%;
  padding-top: 0;
}

/* this hides the newsletter banner across the entire site */
.banner-component.bg--primary-color,
.banner-component.bg--secondary-color {
  display:none;
}

/* Used for hiding the Sponsor logos container. Using the theme options cuased a crtiacal errror. */
.sponsor-container {
    display: none;
}
