/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

/* Everything in /stylesheets/ is enqueued from oceanwp_child_enqueue_parent_style()
   in functions.php, in the order it used to be @import-ed here. Add new stylesheets
   to the $child_stylesheets list there, not as an @import. */

body {
  font-family: "Open Sans",sans-serif;;
}

.content-area{
  width:100%;
  margin:0px;
  border:0px;

}

.content-area .site{
  margin:0px;
}




.dinkm_balance_bar{
  background-color: yellow;
  text-align: right;
}



.dinkm_button_primary{
  display: inline-block;
  padding: 12px 20px;
  margin: 5px 0px;
  font-family: inherit;
  background-color: #0a0a0a;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  margin: 0;
  padding: 14px 20px;
  border: 0;
  cursor: pointer;
  text-align: center;
  letter-spacing: .1em;
  line-height: 1;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.dinkm_button_primary:hover{
  background-color: #00f0a7;
}


.dinkm_button_green{
  border-radius: 50px !important;
  background: #00514B !important;
  display: flex;
  justify-content: center;
  align-items: center;
  color:#ffffff !important;
  border:none;
  font-size: 14x !important;
  padding: 5px 15px;
}

.dinkm_button_green:hover{
  background: #00f0a7 !important;
}

.dinkm_button_white{
  border-radius: 50px !important;
  background: #ffffff !important;
  display: flex;
  justify-content: center;
  border: 3px solid #00514B !important;
  align-items: center;
  color:#00514B !important;
  padding: 5px 15px;
  font-size: 14px !important;
}

.dinkm_button_white:hover{
  background: #00f0a7 !important;
}

.dinkm_button_grey{
  border-radius: 50px !important;
  background: #f4f4f4 !important;
  display: flex;
  justify-content: center;
  border: 1px solid #d6d6d6 !important;
  align-items: center;
  color:#656565 !important;
  font-size: 14px !important;
  cursor: pointer;

}

.dinkm_button_grey:hover{
  background: #00f0a7 !important;
}

.ecoswap_button_lightGreen{
  border-radius: 50px !important;
  background: #00f0a7 !important;
  display: flex;
  justify-content: center;
  border: 1px solid #00f0a7 !important;
  align-items: center;
  color:#00514B !important;
  font-size: 14px !important;
  cursor: pointer;

}

.ecoswap_button_lightGreen:hover{
  background: #ffffff !important;
}


.dinkm_button_toggle{
  border-radius: 50px;
  background: #d3d3d3;
  display: flex;
  justify-content: center;
  border: 3px solid #00514B;
  align-items: center;
  color:#00514B;
  font-size: 12px;
}

.success_box{
  border:1px solid #e9e9e9;
  border-radius: 10px;
  padding: 24px;

}

.cursor_pointer_class{
  cursor: pointer;
}




/* Login / registration gate on checkout */

#dinkm_login_redirect_modal_overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  text-align: center;
  padding: 20px 0;
}
#dinkm_login_redirect_modal {
  background-color: #fff;
  padding: 30px;
  margin: 0 15px;
  border-radius: 5px;
  width: 100%;
  max-width: 900px;
  max-height: 85vh;
  overflow-y: auto;
  position: relative;
  -webkit-overflow-scrolling: touch;
}

#dinkm_login_redirect_close_modal {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 24px;
  cursor: pointer;
}

#dinkm_login_redirect_title {
  margin: 0;
  font-size: 18px;
  line-height: 1.4;
}

/* The my-account form sits left-aligned under the centred title */
#dinkm_login_redirect_account_form {
  margin-top: 25px;
  text-align: left;
}

/* The shortcode renders the account nav only for logged-in users, but hide it
   defensively so the gate can never show a dashboard menu. */
#dinkm_login_redirect_account_form .woocommerce-MyAccount-navigation {
  display: none;
}

#dinkm_login_redirect_account_form .woocommerce-MyAccount-content {
  width: 100%;
  float: none;
}

/* Login | Register side by side, stacking on narrow screens */
#dinkm_login_redirect_account_form .u-column1,
#dinkm_login_redirect_account_form .u-column2 {
  width: 48%;
  float: left;
  margin-right: 4%;
  box-sizing: border-box;
}

#dinkm_login_redirect_account_form .u-column2 {
  margin-right: 0;
}

#dinkm_login_redirect_account_form::after {
  content: "";
  display: table;
  clear: both;
}

@media only screen and (max-width: 767px) {
  #dinkm_login_redirect_modal {
    padding: 20px;
  }

  #dinkm_login_redirect_account_form .u-column1,
  #dinkm_login_redirect_account_form .u-column2 {
    width: 100%;
    float: none;
    margin-right: 0;
  }

  #dinkm_login_redirect_account_form .u-column2 {
    margin-top: 25px;
  }
}

/* Lock the checkout behind the gate: no scrolling, no pointer, no interaction.
   The inert attribute set in partials/checkoutRedirect.php blocks the keyboard. */
body.dinkm_checkout_locked {
  overflow: hidden;
}

/* The theme's "Checkout" page title and breadcrumbs are redundant behind the gate */
body.dinkm_checkout_locked .page-header {
  display: none;
}

body.dinkm_checkout_locked form.checkout,
body.dinkm_checkout_locked .woocommerce-form-coupon-toggle,
body.dinkm_checkout_locked .woocommerce-form-coupon {
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  filter: blur(3px);
  opacity: 0.5;
}

.activate_error_input{
  margin-bottom: 5px;

}

.dinkm_login_redirect_modal_btns{
  display: flex;
  justify-content: center;
}
.dinkm_redirect_btn{
  margin: 0px 5px;
}

/* logout button */
#dinkm_logout_btn{
  color:#3ba1da;
}


/* */
.woocommerce div.owp-woo-single-cond-notice a:hover{
  color:#00f0a7;
}

.product_meta{
  display: none !important;;
}


/* HOME PAGE */
.dinkm_hero_buttons_wrapper{
  display: flex;
  justify-content: flex-start;

}

.dinkm_hero_button{
  width:250px;
  margin:0 10px;
  border: none !important;
}


/* HOME PAGE FEATURED BRANDS */

.home_brands {
  display: flex;



}

@media (min-width: 769px) {
  .home_brands {
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 20px;
    width: 100%;

  }


}


@media (max-width: 768px) {
  .home_brands {
     display: flex;
     flex-direction: row;
     overflow-x: scroll;
     overflow-y: hidden;


     width: 100vw;
     position: relative;
     left: calc(-50vw + 50%);
   }

   .home_brands a{
     flex: 0 0 auto;
   }

 }





.home_brand_card_wrapper {
  display: flex;
  flex-direction: column;
  margin: 6px 5px;
  height: 252px;
  width: 280px;
  position: relative;
  border-radius: 10px;
  box-shadow: 0 0 5px 2px #aeaeae;
}

.home_brand_card_image {
  height: 60%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;


  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;

}

.home_brand_card_image_file {
  max-width: 100%;
  /*margin-top: -50%;*/
  display: inline-block;

}

.home_brand_card_info {
  height: 40%;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding-top: 30px;
  padding-left: 15px;
  padding-right: 15px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;

}

.home_brand_card_info h4 {
  margin-top: 7px;
  line-height: 0;

}

.home_brand_card_info h6 {
  color: grey;
  line-height: 0;
  font-weight: 200;
}


.home_brand_card_logo {
  height: 36px;
  width: 72px;
  position: absolute;
  border-radius: 5px;
  bottom:85px;
    left:15px;

  overflow: hidden;
  box-shadow: 0 0 5px 2px #aeaeae;
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}


/* Buy dinkm page, move card up on mobile */
@media (max-width: 768px) {
  .woocommerce-product-gallery__wrapper{

    margin-top:-90px;
  }
}


.page-id-6657 .elementor-4282 .elementor-element.elementor-element-42c5414{
  display: none;
}


.page-id-6657 .elementor-4282 .elementor-element.elementor-element-3aa5fe0{
  display: none;
}

/*Newsletter Modal */

#ecoswap_newsletter_modal_overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#ecoswap_newsletter_modal {
  background-color: #00514b;
  color:#ffffff;
  padding: 45px;
  border-radius: 5px;
  width: 500px;

  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#ecoswap_newsletter_close_modal {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 24px;
  cursor: pointer;
}

#ecoswap_newsletter_close_modal:hover {
  color: #d0d0d0;
}

.ecoswap_newsletter_banner_btn{
  color:#00f0a7;
}

.ecoswap_newsletter_banner_btn:hover{
  color:#ffffff !important;
  cursor: pointer !important;
}
.ecoswap_newsletter_title{

  margin: 0 !important;
  text-align: center;
}
.ecoswap_newsletter_title1{
  color:#00f0a7;
}
.ecoswap_newsletter_title2{
  color:#ffffff;
}

.ecoswap_newsletter_text{
  margin:20px 0;
  text-align: justify;
}

@media (min-width: 769px) {
 .ecoswap_newsletter_title{
    font-size: 35px;
 }
}

@media (max-width: 768px) {
  .ecoswap_newsletter_title{
    font-size: 25px;
  }
 }

 /* Hacking Banner to be fixed at top*/

 /* #main{
  top:100px !important;
  padding-bottom: 100px !important;
  }


  .simple-banner{
    position: fixed !important;
  }

  @media (min-width: 769px) {
    #site-header{
      position:fixed !important;
      top:45px !important;
    }

   }

   @media (max-width: 768px) {
    #site-header{
      position:fixed !important;
      top:25px !important;
    }
    }
 */

 #dinkm_login_redirect_account_form h2{
  display:none;
 }