/*======================================
Theme Name: Child Theme for MB2 Dental
Theme URI: https://agencyboon.com/
Description: Child Theme for MB2 Dental
Version: 2.0.0
Author: Agency Boon
Author URI: https://agencyboon.com/
Template: Divi
======================================*/
/* You can add your own CSS styles here. Use !important to overwrite styles if needed. */

/*********************
**** GLOBAL HEADER ***
*********************/

/*body:not(.home) .overlap_hero_home_elements {
	display: none !important;
}*/



@media all and (min-width: 980px) {
		#header-first-column {
		width: 40% !important;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#header-second-column {
		width: 90% !important;
	}
}
 
@media all and (max-width: 980px) {
	#header-first-column {
		display: none;
	}
	#page-container .et_pb_section .et_pb_button_1_tb_header {
		letter-spacing: 0px!important;
		padding-right: 15px!important;
		padding-left: 15px!important;
	}		
}

  .et_mobile_nav_menu {
    margin: 0 26px !important;
  }
  
@media (min-width: 980px){  
  #see-thru  {
    background-color:var(--header-seethru-color);
  } 
}  
	.opaque-scrolled  {
    background-color:var(--header-solid-color) !important;
  }
  
 .opaque-scrolled  img{
    transition: all 1.0s ease-out 0s;   
  -webkit-filter:  contrast(1) invert(0) !important; 
  filter: contrast(1) invert(0) !important;  
} 
 #see-thru.opaque-scrolled .et_pb_image_wrap{
			background: none !important;
		  } 	

  #main-menu-header-row {  
padding-top: 20px ;
padding-bottom: 20px ;  
  }
.reduce-main-padding {
transition: all 1.0s ease-out 0s;
padding-top: 10px !important;
padding-bottom: 10px !important;
}
  
@media (min-width: 980px){  
    #second-menu-header-row {  
    padding-top: 10px ;
    padding-bottom: 10px ;  
      }
    .reduce-second-padding {
    transition: all 1.0s ease-out 0s;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    } 
}  
@media (max-width: 979px){  
    #second-menu-header-row {  
    padding-top: 0px ;
    padding-bottom: 0px ;  
      }
    .reduce-second-padding {
    transition: all 1.0s ease-out 0s;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    } 
	.et_pb_row_inner_1_tb_header{
	background-color:var(--mobile-menu-back-color) !important;	
	}
}   
.increase-row-width {
transition: all 1.0s ease-out 0s;
width: 100% !important;
}
.reduce-logo-size img{
  transition: all 1.0s ease-out 0s;
  max-height: 70px !important;
} 
.slow-transition {
transition: all 1.0s ease-out 0s;
}
#header-hero-content {
	padding-top: var(--main-title-padding-top)!important;  
}  
#hero-header-section {
	margin-top: var(--main-content-margin-top);
}  



/* style superscript registered for invisalign and lumineers */

sup.registered-r {
	bottom: 0.3em;
}

.entry-title sup.registered-r.title {
	font-size: 30px;
}



/* Main Menu mobile - hide cloned category link on desktop, so that on mobile we can click on the category page. example: 'About' on desktop, 'About us' on mobile */

/* @media all and (min-width: 981px) {
	#top-menu .hide-on-desktop, 
	#top-menu .mega-menu .sub-menu .hide-on-desktop {
		display: none!important;
	}
} */

@media all and (min-width: 981px) {
    body header .et_pb_menu .hide-on-desktop  {
		display: none!important;
	}
}


/********************************
**** INSURANCE SECTION CSS *****
********************************/

@media (max-width: 479px) {
	.insurances .et_pb_column {
		width: 50%!important;
	}
	.insurances .et_pb_column {
		margin: 0 0 10px 0!important;
	}
}
@media all and (min-width: 981px) {
	.et-menu-nav .menu-hide-desktop, 
	.et-menu-nav .mega-menu .sub-menu .menu-hide-desktop {
		display: none!important;
	}
} 

@media (max-width: 980px) {
	.insurances .et_pb_column {
		margin-bottom: 0;
	}
#header-hero-content {
	padding-top: var(--main-title-padding-top-mobile)!important;  
}  
#hero-header-section {
	margin-top: var(--main-content-margin-top-mobile);
}  	
}

/********************
**** Doctors (meet-team) CSS ***
********************/

/*** Style Staff - Meet Doctors portfolio add TWO COLUMN PORTFOLIO GRID LAYOUT ***/

@media only screen and ( min-width: 768px ) { 
	.two-column-grid .et_pb_grid_item {
		width: 45% !important;
		/* margin: 0 7.5% 3% 0 !important; */
	}
}

/*  Style Staff - Meet Doctors portfolio if there are more than 2 doctors. use class three-column-grid for THREE COLUMN PORTFOLIO GRID LAYOUT */
 @media only screen and ( min-width: 768px ) { 
	.three-column-grid .et_pb_grid_item {
		width: 28.333% !important;
		margin: 0 7.5% 3% 0 !important;
	}
	
	.three-column-grid .et_pb_grid_item:nth-child(3n) {
		margin-right: 0 !important;
	}

	.three-column-grid .et_pb_grid_item:nth-child(3n+1) {
		clear: left;
	}

	.three-column-grid .et_pb_grid_item:nth-child(4n+1) {
		clear: unset !important;
	}
}


/* Doctors portfolio */

.doctors-gallery .et_pb_module_header {
	margin: 0!important;
	box-shadow: 0px 2px 18px 0px rgba(115,102,122,0.1);
	padding: 25px 15px!important;
	background-color: #ffffff;

}

/* center portfolio doctors */

@media (min-width: 768px) {
.et_pb_portfolio_grid_items{
	    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
}

/********************
**** Order image - Change column order on tablet & mobile ***
********************/

.order_image {
	-ms-box-orient: horizontal;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -moz-flex;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}

@media (max-width: 980px){
	.order_image {
		display: -webkit-flex;
		-webkit-flex-direction: column-reverse;
		display: flex;
		flex-direction: column-reverse !important;
	}
	
	.order_image .et_pb_with_border.et_pb_module.et_pb_image {
		max-width: 600px;	
		margin-bottom: 30px;
	}
	
	.order_image .et_pb_module.et_pb_image.et_pb_image_0 {
		margin-bottom: 30px;
	}
}

/* Inline buttons */


.btn-inline .et_pb_button_module_wrapper {
	display: inline-block;
}
@media (max-width: 490px) {
	.btn-inline .et_pb_button_module_wrapper {
		display: block;
	}
}

.btn-inline {
	text-align: center!important;
}

/* Add classes "left", "right", "center" for the code to work */

.btn-inline.center {
	text-align: center !important;
}
.btn-inline.left {
	text-align: left !important;
}
.btn-inline.right {
	text-align: right !important;
}



/*** Vertical align middle for rows with multiple columns, add this class to column which content you want to be vertical middle align !!! DON'T FORGET TO ACTIVATE "EQUALIZE COLUMNS HEIGHT" ON ROW OPTIONS IN DESIGN TAB !!! ***/
.vertical_middle_content{
	display: flex; 
	flex-direction: column; 
	justify-content: center;
}

/*** HIDE the title photos, inside of image popup, when it's activated in module ***/
.mfp-title {
	display: none!important;
}


/*********************
**** BLOG PAGE CSS ***
*********************/

/** Post template - post meta */
.posts_meta p.post-meta,
.posts_meta p.et_pb_title_meta_container {
    padding: 0px 0px 20px 0px;
}

#commentform{
	padding-bottom: 0;
}

/* Blog page margin for older entries ( Mobile -> « Older Entries and Next Entries » are too close to the Search bar)  */

.pagination {
    clear: both;
    margin-bottom: 30px;
}

/*** Individual Staff pages & Individual Posts removing bottom space ***/
.single .et_pb_post {
	margin-bottom: 0;
}


/* Menu Primary */

.nav.et-menu li ul.sub-menu li {
    display: block;
}

 
/* Blog Read More Buttons */
.et_pb_posts a.more-link{
	display:inline-block!important;
	margin-top:25px;
	margin-bottom:0px;
}

/* ??? */

body header .et_pb_menu a {
    white-space: normal;
}

/*** Scroll Mobile Services Menu ***/

body header #see-thru .et_pb_menu .et_mobile_nav_menu .et_mobile_menu {
    background-color:var(--mobile-menu-back-color) !important;
	max-height: 400px!important;
	overflow-y: scroll!important;
	width:100%!important;
}

ul#mobile_menu {
	max-height: 400px!important;
	overflow-y: scroll!important;
}


/**** This hides the sub menu items on mobile ****/
#page-container .mobile_nav li ul.hide {
    display: none !important;
}
.mobile_nav.opened .mobile_menu_bar:after {
	font-family: 'ETmodules'!important;
    font-size: 30px!important;
	font-weight: bold!important;
    content: '\4d'!important;
    left: 0px!important;
    text-align: center!important;
    font-weight: normal!important;
    font-variant: normal!important;
    text-transform: none!important;
    -webkit-font-smoothing: antialiased!important;
   	position: relative!important;
    display: block!important;
	cursor: pointer;
}

.mobile_nav.opened .mobile_menu_bar:before {
	display: none!important;
}
.mobile_nav.closed .mobile_menu_bar:before {
	display: block!important;
}



/**** This adjusts the positioning and the background transparency of the parent menu item on mobile ****/
#page-container .mobile_nav .menu-item-has-children {
    position: relative;
}
#page-container .mobile_nav .menu-item-has-children > a {
    background: transparent;
}
/**** This styles the icon and moves it to the right ****/
#page-container .mobile_nav .menu-item-has-children > a + span {
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px 20px;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
    z-index: 3;
}
/**** Here you can swap out the actual icons ****/
#page-container span.menu-closed:before {
    content: "\4c";
    display: block;
    color: #000;
    font-size: 16px;
    font-family: ETmodules;
}
#page-container span.menu-closed.menu-open:before {
    content: "\4d";
}

/** Post template - post meta */
.posts_meta p.post-meta,
.posts_meta p.et_pb_title_meta_container {
    padding: 0px 0px 20px 0px!important;
}

#commentform{
	padding-bottom: 0!important;
}

/* Blog page margin for older entries ( Mobile -> « Older Entries and Next Entries » are too close to the Search bar)  */

.pagination {
    clear: both;
    margin-bottom: 30px;
}

/***************************************
**** Homepage Section - Testimonials ***
***************************************/


/* homepage testimonials  - adaptive height  */
.et_pb_slide .et_pb_container.clearfix {
    height: auto!important;
}

/* testimonial arrows  */

@media (max-width: 480px) {
	a.et-pb-arrow-prev {
		margin-left: -16px;
		z-index: 1;
	}
	a.et-pb-arrow-next {
		margin-right: -16px;
		z-index: 1;
	}
}

.et_pb_slider:hover .et-pb-arrow-prev {
	left: 0px;
	opacity: 1;
}

.et_pb_slider:hover .et-pb-arrow-next {
    right: 0px;
    opacity: 1;
}

/* All Services section modules (Home and Services Pages) - icons on two columns on mobile */

@media (max-width: 479px)  {
	.services .et_pb_column {
		width: 50%!important;
	}
} 

/* Add margins to bullets on Services Pages */

.et_pb_text li { 
	margin-top: 16px; 
}

/* Customize Select box in Browser for Safari (targeted browser selection does not work)*/

.safari select{
	-webkit-appearance:none!important;
	border-radius: 0px!important;
}

/*** Homepage at the end, columns margin for locations and 'Let’s get you scheduled!'  ***/

@media (max-width: 980px) {
	
	.blurb_scheduled .et_pb_column {
		margin-top: 30px;
	}
	
	.locations_blurb .locations_top_margins {
		margin-top: 30px;
	}
}


/* Patient forms - bulleted list as buttons */
#patient-forms li{
	list-style: none;
}
#patient-forms li a{
	display: block;
	padding: 5px 5px 5px 5px;
	background: #fafafa;
	border: 1px #eaeaea solid;
	border-radius: 5px;
	font-size: 18px;
	font-weight: 500;
	text-decoration:none !important;
	margin-bottom: 7px;
}
#patient-forms li a:hover{
	background: transparent;
	border: 1px #cacaca solid;
	text-decoration:none !important;
}
#patient-forms li a:before {
	font-family: ETmodules!important;
	content: "\e092";
	color: #cacaca;
	padding: 6px 10px 0px 5px;
}

@media (max-width: 980px){
   footer .et_pb_menu--style-left_aligned.et_pb_text_align_right .et_pb_menu__wrap {
       justify-content: center;
    }

    footer .et_pb_menu .et_pb_menu__menu {
         display: block!important;
     }

	footer .et_mobile_nav_menu {
		display: none!important;
	}
}


/*Settings for hamburger drop down collapsable*/
.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
    background-color: transparent;
    position: relative;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after, #main-header .et_mobile_menu .menu-item-has-children > a:after {
    font-family: 'ETmodules';
    text-align: center;
    speak: none;
    font-weight: 600;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    font-size: 18px;
    content: '\4c';
    top: 11px;
    right: 13px;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
    content: '\4d';
}

.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
    display: none !important;
    visibility: hidden !important;
    transition: all 1.5s ease-in-out;
}

.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
}
/*END Settings for hamburger drop down collapsable*/

/* HIDE ME */

.hide-me{
	display: none !important;
}  


/* Gravity form  */

/* captcha font size */

 .captcha_form {
	font-size:14px!important;
	text-align:left; 
	color:#fff;
}

/* add scroll on sub-submenu */

	.long_services ul{
		max-height: 500px;
		width: 320px !important;
		overflow: hidden;
		overflow-y: scroll;
	}
	.long_services ul li{
		padding: 0 0 0 10px !important;
	}
	.long_services ul li a{
		padding: 5px 0 5px 5px !important;
		width: 290px !important;
	}

/* sub-submenu on two columns*/
/* 
	.long_services ul{
		width: 600px !important;
		top: 3px !important;

	}

	.long_services ul li{
		display: block;
		float: left;
		display: inline;
		width: 50%;
		word-wrap: no-wrap!important;
		border-bottom: solid 1px #eaeaea;
		border-right: solid 1px #eaeaea;
		border-left: solid 1px #eaeaea;
		padding: 0 0 0 15px !important;
	}
.long_services ul li a{
		padding: 5px 0 5px 5px !important;
		width: 300px !important;
	}
*/



/**** Other ***/
/* to delete from template 6
 * 
 *  .et_pb_blurb_content {
	margin: 0 0!important;
}

.et_pb_slide {
	padding: 0 0!important;
}


 Remove text shadow in Divi slider modules

.et_pb_slide_description {
	text-shadow:none !important;
}
	 */

/* Styles for T1 specific */


/***************************
**** CSS FOR TEMPLATE 1  ***
****************************/

/*** Homepage elements with Border Inside ***/

.interior_border_15px{
	outline: 1px solid white;
	outline-offset:-15px;
}

/* Template 1 style 1 - interior border on homepage section */

.interior_border_40px{
	outline: 1px solid white;
	outline-offset:-40px;
}

/* Round corners on columns */

.t1border {
	border-radius: 60px 0px 60px 0px;
}


@media (max-width: 479px){
	.et_pb_menu .et_mobile_menu {
		padding: 3% !important;
	}
	.et_pb_menu_0_tb_header.et_pb_menu ul li a {
		font-size: 14px !important;
	}	
	.et_mobile_menu li a {
		padding: 10px 3% !important;
	}	
}