/*
 Theme Name:     Distress Centre Divi Theme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Jennifer Leigh
 Author URI:     https://atomstudio.ca
 Template:       Divi
 Version:        0.0.9
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */
body{
    font-size: 16px;
	
}

.ds-menu-active{
    border-bottom: 7px solid #F26C52;
}

/*--Password Protected Page--*/
.et_password_protected_form {
    margin: 200px auto;
    max-width: 600px;
}


/*SafeExit*/
button#quick-exit-bottom { position: fixed; bottom: 23px; left: 30px; padding: 11px 23px;border:0; cursor: pointer;-webkit-box-shadow: 0px 0px 15px -7px #000000; 
box-shadow: 0px 0px 15px -7px #000000;}
button#quick-exit-bottom:hover{background: #B0BC22}




  /*--Circle Image Masks--*/

        .circle-mask img{-webkit-mask-size: contain;  mask-size:  contain; -webkit-mask-repeat: no-repeat;  mask-repeat: no-repeat;-webkit-mask-position: center;
        mask-position: center; aspect-ratio: 1/1; object-fit: cover;}

        .circle-mask:before,.circle-mask:after{content: " "; position: absolute; display:block;z-index: 2; background-size: contain; background-repeat: no-repeat;}

        .circle-mask-1 img{-webkit-mask-image: url('assets/masks/circle-mask-1.svg');  mask-image: url('assets/masks/circle-mask-1.svg');}
        .circle-mask-1:before{background-image:url('assets/circles/circle-green-1.svg'); opacity: .75; width:245px; height:245px; bottom:-20%;right:-10%; }
        .circle-mask-1:after{background-image:url('assets/circles/circle-blue-1.svg'); opacity: 1; width:82px; height:82px; bottom:35%;right:-20%; }

        .circle-mask-2 img{-webkit-mask-image: url('assets/masks/circle-mask-2.svg');  mask-image: url('assets/masks/circle-mask-2.svg');}
        .circle-mask-2:before{background-image:url('assets/circles/circle-blue-2.svg'); opacity: .75; width:215px; height:215px; bottom:-10%;left:0; mix-blend-mode: multiply; }
        
        .circle-mask-3 img{-webkit-mask-image: url('assets/masks/circle-mask-1.svg');  mask-image: url('assets/masks/circle-mask-1.svg');}
        .circle-mask-3:before{background-image:url('assets/circles/circle-green-1.svg'); opacity: .75; width:150px; height:150px; bottom:-15%;right:10%; }
        .circle-mask-3:after{background-image:url('assets/circles/circle-lightblue-1.svg'); opacity: 1; width:90px; height:90px; bottom:-20%;left:40%; }

        .circle-mask-sorce-1 img{-webkit-mask-image: url('assets/masks/circle-mask-1.svg');  mask-image: url('assets/masks/circle-mask-1.svg');}
        .circle-mask-sorce-1:before{background-image:url('assets/circles/circle-red-1.svg'); opacity: 1; width:220px; height:220px; bottom:-15%;left:0;mix-blend-mode: multiply; }
        .circle-mask-sorce-1:after{background-image:url('assets/circles/circle-blue-1.svg'); opacity: 1; width:90px; height:90px; bottom:-20%;left:35%; rotate: 50deg; }
        
        .circle-mask-sorce-2 img{-webkit-mask-image: url('assets/masks/circle-mask-1.svg');  mask-image: url('assets/masks/circle-mask-3.svg');}
        .circle-mask-sorce-2:before{background-image:url('assets/circles/circle-red-2.svg'); opacity: 1; width:150px; height:150px; bottom:0%;right:5%; }
        .circle-mask-sorce-2:after{background-image:url('assets/circles/circle-grey-1.svg'); opacity: 1; width:90px; height:90px; bottom:-10%;right: 30%;mix-blend-mode: multiply; }


        @media all and (max-width: 980px) {

        .circle-mask-sorce-1:before{ width:120px; height:120px;  }
        .circle-mask-sorce-1:after{width:20px; height:20px;  }
        
        .circle-mask-sorce-2:before{width:50px; height:50px;  }
        .circle-mask-sorce-2:after{width:20px; height:20px; }



        }



/*--Top Navigation--*/
   .et-menu .menu-item-has-children > a:first-child::after{color:#EE9718}


/*--General Typography--*/
p + h2, ul + h2, ol + h2 {margin-top:30px;}
h2 + p {margin-top:10px;}
em{font-style:italic!important;}


/*ol li::marker { color: #B0BC22; font-weight: 700;}*/
ol{
  list-style: none !important;   
  counter-reset: jl-ol;
  padding-left: 20px!important  ;            
  margin-left: 0;
}

ol > li{
  counter-increment: jl-ol;
  position: relative;
  padding-left: 0.25em;
}

ol> li::before{
  content: counter(jl-ol) ". ";
  position: absolute;
  left: -1.6em;
  width: 1.4em;
  text-align: right;
  color:  #B0BC22;
  font-weight: 700;
}

/*--Tables--*/


.entry-content table thead tr{background-color: #136A93; color: #fff;font-size: 22px; font-family: 'Oswald', Helvetica, Arial, Lucida, sans-serif; font-weight: 400;}
.entry-content table thead tr td{font-size: 22px; } 
.entry-content table tr td strong{color: #136A93; font-size: 22px; font-family: 'Oswald', Helvetica, Arial, Lucida, sans-serif; font-weight: 400;}
.entry-content tr td {padding:20px; font-size:18px; }
table tr {background: #fff}
.entry-content table:not(.variations), tr, td, table {  border-color: #d1d1d145 !important;}



/* Chartify (Google Charts) tooltip styling */

.google-visualization-tooltip{
  pointer-events: none !important;
}
.google-visualization-tooltip{
  background: #fff !important;
  color: #222222 !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 0 15px 0px 15px !important;
  box-shadow: none !important;
  white-space: wrap !important;
  max-width: 200px;
  width:max-content;
  min-width: 100px;
  -webkit-box-shadow: 0px 0px 21px 0px #00000022!important; 
    box-shadow: 0px 0px 21px 0px #DEDEDE!important;    
}

/* Tooltip content text */
.google-visualization-tooltip *{
  color: inherit !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
 
}
.google-visualization-tooltip li:last-child { padding-bottom:15px!important;}


/* If your tooltip uses the default <ul><li> structure */
.google-visualization-tooltip ul{
  margin: 0 !important;
  padding: 0 !important;
}
.google-visualization-tooltip li{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}


.ays-chart-charts-main-container[data-type="donut_chart"]  .google-visualization-tooltip li:last-child,
.ays-chart-charts-main-container[data-type="donut_pie"]  .google-visualization-tooltip li:last-child
 {
  display: none !important;
}




/* = DIVI
------------------------------------------------------- */

/*--General Tweaks and Fixes--*/

   /* #main-content .et_pb_section:not(et_pb_sticky_module){overflow-x:hidden;width:100vw; overflow-y:visible!important}*/
    p a {text-decoration: underline;}

    
    
    /*Divi Buttons*/

    @media all and (min-width: 980px) {
    .et_pb_button_module_wrapper:not(.et_pb_button_alignment_right):not(.et_pb_button_alignment_center) { display: inline-block;margin-right: 15px;}
    .et_pb_button_module_wrapper:not(.et_pb_button_alignment_right):not(.et_pb_button_alignment_center)+ .et_pb_button_module_wrapper { }
    }
    .et_pb_button.simple-button-arrow:hover:after{margin-left:.5em!important;}

    /*--Divi video player-*/
    .et_pb_video_overlay_hover {background: rgba(19, 106, 147, 0.82);}
    



    /*--General Spacings--*/
    .et_pb_gutters3 .et_pb_column_2_3 .et_pb_module, .et_pb_gutters3.et_pb_row .et_pb_column_2_3 .et_pb_module{margin-bottom:0;}
    .et_pb_social_media_follow li {    margin-bottom: 0px;  }
    /*.et_pb_row + .et_pb_row {padding-top:0px;}*/
    .et_pb_row  {margin: 0 auto;}
    .et_pb_text + .et_pb_button_module_wrapper{margin-top:20px;}


    /*Blog Grid*/
    .et_pb_module.et_pb_posts.better-blog-grid > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
    .et_pb_module.et_pb_posts.better-blog-grid .et_pb_post{margin-bottom:0;}
    .et_pb_module.et_pb_posts.better-blog-grid .et_pb_ajax_pagination_container article{background: #fff; padding: 40px; border-radius: 3px; overflow:  hidden;}
    .et_pb_module.et_pb_posts.better-blog-grid .et_pb_ajax_pagination_container article .entry-featured-image-url{margin:-40px -40px 40px -40px}


    .et_pb_module.et_pb_posts.better-blog-grid > div > article.et_pb_post img{ border-bottom: 3px solid transparent; aspect-ratio: 4/3; object-fit: cover;}
    .et_pb_module.et_pb_posts.better-blog-grid > div > article.et_pb_post:nth-child(4n + 1) img { border-bottom-color:#B0BC22;}
    .et_pb_module.et_pb_posts.better-blog-grid > div > article.et_pb_post:nth-child(4n + 2) img { border-bottom-color:#EE9718;}
    .et_pb_module.et_pb_posts.better-blog-grid > div > article.et_pb_post:nth-child(4n + 3) img { border-bottom-color:#136A93}
    .et_pb_module.et_pb_posts.better-blog-grid > div > article.et_pb_post:nth-child(4n) img {  border-bottom-color: #D1D1D1}

    .et_pb_posts a.more-link {
        clear: both;
        display: block;
        margin: 34px 0 0 0;
        text-transform: capitalize;
        text-decoration: none!important
    }

    .et_pb_posts a.more-link:after{
       transition: all .5s ease-in-out;
    content:"\f061";
    color: currentColor;
    line-height: inherit;
    font-size: inherit !important;
    opacity: 1;
    margin-left: .3em;
    left: auto;
    font-family: FontAwesome !important;
    font-weight: 900 !important;
    text-decoration: none!important

    }

     .et_pb_posts a.more-link:hover:after{margin-left:.5em;}

    /*Single Blog Posts*/
            /*Template*/
            .et_pb_text.tags {display: flex; flex-wrap: wrap;align-content: center; align-items: center;}
            .et_pb_text.tags a{font-size: 14px; transition: all .2s ease-in-out;color: #222222; text-transform: uppercase; background: #F1F2F2; padding: 5px 12px; margin: 2px;border-radius:3px; display:inline-block; text-decoration: none;}
            .et_pb_text.tags a:hover{background-color:#222222; color: #fff; }

            /*Also see gutenberg styling below*/




    /*Navigation button*/
    .et_pb_menu .et_pb_menu__menu>nav>ul>li{    align-items: center;}

    .et_pb_menu--with-logo .et_pb_menu__menu>nav>ul>li>a{padding: 50px 0;}
    /*Dropdown Menu*/
    .et_pb_menu .et-menu-nav>ul ul.sub-menu {border-radius: 0  0 4px 4px; box-shadow: none; padding:20px; width: 270}

    .et_pb_menu_0_tb_header.et_pb_menu ul li a{font-weight: 600!important}
    ul.sub-menu li a {width:100%; font-weight: 600!important; line-height: 1.3; padding: 7px 20px!important; font-size: 16px!important; text-transform: none!important; font-family: 'Poppins', Helvetica, Arial, Lucida, sans-serif!important; font-weight: normal!important;}
    ul.sub-menu li a:hover {background:transparent; opacity:1; }

    ul.sub-menu li  { width: 100%; padding:0!important;}

    /*Mobile Menu*/
    .et_pb_menu .et_mobile_menu{padding: 10% !important;}
    .et_pb_menu .et_mobile_menu > li > a {padding: 20px 0 5px 0;}
    .et_pb_menu .et_mobile_menu li ul.sub-menu{padding-left:0!important;}
    .et_pb_menu  ul.sub-menu li a{padding: 7px 0px!important}
    .et_mobile_menu .menu-item-has-children>a{background-color:transparent!important}


    /*Icons*/
    ul.et_mobile_menu li.menu-item-has-children > a { padding-right: 44px;  position: relative;}    
    ul.et_mobile_menu li.menu-item-has-children > a::after {content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 22px; line-height: 1; font-weight: 700;}
    ul.et_mobile_menu li.menu-item-has-children.dt-open > a::after { content: "−";}


        .et_mobile_menu li a{ border:none; padding: 5px 0; }
        
        .et_mobile_menu li a:hover{opacity: 1; background: transparent;  }
        
        header .et_mobile_menu{
                position: fixed;
                left: 0;
                top: 50px;
                width: 100%;
                margin: 0;
                overflow: scroll;
                max-height: 100vh;
                height: 90vh;
            
        }

       

        header .mobile_menu_bar:before{
            content: "Menu";
            font-family: 'Oswald',Helvetica,Arial,Lucida,sans-serif!important;
            font-size:20px;
            font-weight: 900;
            padding: 10px 15px 10px 45px;
            color: #fff!important;
            text-transform: uppercase;
            transition: all .25s ease-in-out;
            background: url(assets/images/icon-hamburger-open.svg) no-repeat 15px;
            margin-top:-7px;
            background-color: #136A93;
            border-radius: 3px;
         

        }

   

        header .mobile_nav.opened .mobile_menu_bar:before{
            background:  #004260 url(assets/images/icon-hamburger-close.svg) no-repeat 15px;
            color:white;
        }
       

        .et_pb_menu__wrap .mobile_menu_bar{
            transform: none;
        }

      



       
        /* Hide the Sub-menu */
        ul.et_mobile_menu .menu-item-has-children .sub-menu,
        #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
        .et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
        .et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
        max-height:0px;
        overflow: hidden; 
        opacity: 0;
        transition: all .25s ease-in-out;
        }

        /* Show the sub-menu when the + icon is clicked */
        ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
        #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
        .et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
        .et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
        display: block !important;
        visibility: visible !important;
        max-height: 100vh;
        opacity: 1;

        }

        /* Create the opening/closing icon using the SVG Icons */
        ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons,
        .et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons {
        top: 10px;
        position: relative;

        }

        

       

        /*adjust Divi Menu module breakpoint*/
        @media only screen and (max-width: 1149px) {
            .et_pb_menu .et_pb_menu__menu {
                display: none;
            }
            .et_mobile_nav_menu {
                display: block;
            }
        }





/* = Accessibility
------------------------------------------------------- */

:focus-visible{
    outline: 3px solid #EE9718;
    outline-offset: 3px;
}

/* = WordPress/Gutengberg
------------------------------------------------------- */
    /*General Spacings*/
    
        .wp-block-heading + p, p + ul { margin-top:10px;}
        p + .wp-block-heading{ margin-top:40px;}

        p + h2.wp-block-heading, 
		.wp-block-quote + h2.wp-block-heading, 
		.wp-block-columns + h2.wp-block-heading, 
		.wp-block-list + h2.wp-block-heading{ margin-top:60px;}

        body.single p{
            margin:0; padding:0;
        }


        .et_pb_text_inner p {padding-bottom: 0!important;}


        .et_pb_text_inner p + p, .et_pb_text_inner p + ul, .et_pb_text_inner p + ol {margin-top: 1em;}
        
        body.single p + p{
            margin-top: 1em;
        }

		.wp-block-list li + li, .et_pb_text_inner li + li{
			margin-top:.5em;
		}

         blockquote.wp-block-quote, .wp-block-image, .wp-block-columns, .wp-block-buttons, .wp-block-media-text,.wp-block-separator, .wp-block-list{
             margin:30px auto;
       
		}

    /*Quote*/
        blockquote.wp-block-quote {
            background: #F1F2F2;
            border-radius: 3px;
            border: none;
            padding: 50px;
 
        }

        blockquote.wp-block-quote cite{
            font-weight: 700;
            text-transform: uppercase;
            font-size: 14px;
            color: #222222 !important;
            line-height: 1em;
            margin-top: 20px;
        }

        blockquote.wp-block-quote cite:before {
            content: "– ";
        }
    
     /*Seperator*/    
        .wp-block-separator{
            width: 100% !important;
            background:#F1F2F2 !important;
            border:none;
            height:1px;

        }

    /*Button*/
    .wp-block-button a, button, .frm_style_formidable-style.with_frm_style .frm_submit button{
        color: #000 !important;
        border-radius: 7px;
        letter-spacing: 0px;
        font-size: 20px;
        background-color: #EE9718;
        transition: all .25s ease-in-out;
        text-decoration: none!important;
        font-family: 'Oswald', Helvetica, Arial, Lucida, sans-serif;
        text-transform: uppercase;
        border: 2px solid  #EE9718;

    }

    .wp-block-button a:hover, button:hover, .frm_style_formidable-style.with_frm_style .frm_submit button:hover{
        background-color:   transparent;
         border: 2px solid  #EE9718;
    }

    /*Images*/
    .wp-block-image{border-radius: 3px;overflow:hidden;}
    
    
    /*Alignwide/full*/
    .alignwide{ margin-left: auto;  margin-right: auto;  width: 120%; margin-left:-10%;}

/* Full width alignment */
    .alignfull { max-width: none;  width: 100vw;  margin-left: calc(50% - 50vw);  margin-right: calc(50% - 50vw);}


body.error404 #page-container {
    background: url(/wp-content/uploads/2023/08/Distress-Centre-HP-Hero-Animation.svg);
}

body.error404 #main-content, body.error404 .et_pb_section, body.error404 .et_pb_menu{background:transparent!important;}

/* = Responsive Styling
------------------------------------------------------- */
/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
  
}
 
/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {
 
}

/*Tablet and above*/
@media all and (min-width: 980px) {
    .et_pb_menu_0_tb_header.et_pb_menu ul li.button.menu-item a { background: #136A93; font-size:22px; padding: 15px 20px!important; border-radius: 5px; color: #fff!important;}
}
 
/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
     .et_pb_module.et_pb_posts.better-blog-grid .et_pb_ajax_pagination_container { display: grid; grid-template-columns: repeat(1, 1fr); gap: 30px; }


    .circle-mask-1, .circle-mask-2, .circle-mask-3{margin-bottom:150px!important;}
    .circle-mask-1:before{background-image:url('assets/circles/circle-green-1.svg'); opacity: .75;  bottom:-20%;right:10%; }
    .circle-mask-1:after{background-image:url('assets/circles/circle-blue-1.svg'); opacity: 1;  bottom:10%;right:-5%; }


 
}
 
/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {

    
 
}
 
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
	#hero h2 {font-size: 24px!important;}
    .et_pb_blog_grid .column.size-1of1 .et_pb_post{height: auto!important;}

    .circle-mask-1, .circle-mask-2, .circle-mask-3{margin-bottom:70px!important;}
    .circle-mask-1:before{background-image:url('assets/circles/circle-green-1.svg'); opacity: .75; width:145px; height:145px; bottom:-20%;right:5%; }
    .circle-mask-1:after{background-image:url('assets/circles/circle-blue-1.svg'); opacity: 1; width:82px; height:82px; bottom:35%;right:-10%; }
    .circle-mask-2:before{background-image:url('assets/circles/circle-blue-2.svg'); opacity: .75; width:130px; height:130px; bottom:-10%;left:0; mix-blend-mode: multiply; }
    .circle-mask-3:before{background-image:url('assets/circles/circle-green-1.svg'); opacity: .75; width:95px; height:95px; bottom:-15%;right:5%; }
    .circle-mask-3:after{background-image:url('assets/circles/circle-lightblue-1.svg'); opacity: 1; width:50px; height:50px; bottom:-20%;left:50%; }   

    /* Make tables scroll horizontally */

 .et_pb_text_inner:has(table){overflow:scroll; width:100vw; margin-left:-10%; padding:10%;}


  table {
  min-width: 700px;
  border-collapse: collapse;
  width: 100%;
  overflow:scroll;
  border: 0 !important;

  }

  .table::-webkit-scrollbar {
  height: 6px;
}



  /* Scroll hint */
  table::after {
    content: "← Scroll to view full table →";
    display: block;
    text-align: left;
    font-size: 0.85rem;
    color: #666;
    padding: 8px 0;
    max-width: calc(100vw - 10%);
  }


 
}
 
/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
 
}