Skip to main content
Print

Wocommerce Basic Css

Cart Page style


/*Cart page style start*/
body.woocommerce-cart #page-container .product-remove {
  width: 30px;
	background: transparent;
    border: none;
	
}


body.woocommerce-cart #page-container .product-thumbnail {
  width: 115px;
}
body.woocommerce-cart table.cart button[name="update_cart"]:not([disabled]) {
  border: 1px solid #057dcd;
  color: #057dcd;
}
body.woocommerce-cart #page-container .product-name a:hover{
	color: #FFCE75;
}
body.woocommerce-cart table.cart button[name="update_cart"]:not([disabled]):hover {
  color: #1e3d58;
}

/*Cart page style end*/

Woocommerce global button style

/*Woocommerce global button style start*/
body #page-container #et-boc #et-main-area .single_add_to_cart_button,
body #page-container #et-boc #et-main-area .add_to_cart_button,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button,
body.woocommerce #page-container #et-boc #et-main-area ul.products li.product .button,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button,
body.woocommerce-page #page-container #et-boc #et-main-area button.button{
  background-color: #057dcd !important;
  color: #ffffff !important;
  font-size: 16px !important;
  letter-spacing: 0px !important;
  padding-top: 10px !important;
  padding-right: 25px !important;
  padding-bottom: 10px !important;
  padding-left: 25px !important;
  border-radius: 8px;
  border: none !important;
}
body.woocommerce-page #page-container #et-boc #et-main-area a.checkout-button{
	padding: 1em;
}
body #page-container #et-boc #et-main-area .single_add_to_cart_button:hover,
body #page-container #et-boc #et-main-area .add_to_cart_button:hover,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button:hover,
body.woocommerce #page-container #et-boc #et-main-area ul.products li.product .button:hover,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button:hover,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button:hover,
body.woocommerce-page #page-container #et-boc #et-main-area button.button:hover{
  background-color: #ffce75 !important;
  color: #1f3d58 !important;
}

body #page-container #et-boc #et-main-area .single_add_to_cart_button:after,
body #page-container #et-boc #et-main-area .add_to_cart_button:after,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button:after,
body.woocommerce ul.products li.product .button:after,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area a.button:after,
body.woocommerce-page.et_pb_button_helper_class #page-container #et-boc #et-main-area button.button:after {
  display: none;
}

body.woocommerce-account.et_pb_button_helper_class #page-container #et-boc #et-main-area  a.button{
  background-color: #FFCE75 !important;
  padding: 12px 30px !important;   
  color: #162535 !important;
  border: none !important;
  
}
body.woocommerce-account.et_pb_button_helper_class #page-container #et-boc #et-main-area  a.button:hover{
  background: #162535 !important;
  color: #fff !important;
}
body.woocommerce-account #page-container #et-boc #et-main-area  a.button:after{
  display: none !important;
}

body.woocommerce #page-container #et-boc #et-main-area #respond input#submit,
body.woocommerce-page #page-container #et-boc #et-main-area #respond input#submit,
body.woocommerce #content input.button,
body.woocommerce-page #page-container #et-boc #et-main-area #content input.button,
body #page-container #et-boc #et-main-area .woocommerce-message,
body #page-container #et-boc #et-main-area .woocommerce-error,
body #page-container #et-boc #et-main-area .woocommerce-info {
  background: #057dcd !important;
  font-size: 15px !important;
}

/*Woocommerce global button style end*/

Product page style


body #page-container #et-boc #et-main-area .et_pb_shop .woocommerce-result-count,
body #page-container #et-boc #et-main-area .et_pb_shop .woocommerce-ordering {
  display: none;
}
body #page-container #et-boc #et-main-area ul.products li.product a img,
body.woocommerce-page #page-container #et-boc #et-main-area ul.products li.product a img {
  max-height: 275px;
  height: 30vw;
  object-fit: cover;
  object-position: center;
}

Account page style

/*Account page style start*/
body.woocommerce-account #page-container #et-boc #et-main-area .woocommerce-MyAccount-navigation ul li a {
  color: #1e3d58;
}
body.woocommerce-account #page-container #et-boc #et-main-area .woocommerce-MyAccount-navigation ul li.is-active a {
  color: #ffce75;
}
body.woocommerce-account #page-container #et-boc #et-main-area .woocommerce-MyAccount-navigation ul li {
  padding-left: 0;
}
body.woocommerce-account  #page-container #et-boc #et-main-area .woocommerce-MyAccount-navigation ul li:before {
  display: none;
}
body.woocommerce-account #page-container #et-boc #et-main-area .woocommerce-MyAccount-navigation { 
box-shadow: 0 2px 18px rgba(0, 0, 0, 0.05);
  padding: 15px;
  background: #ffffff;
}
body.woocommerce-account #page-container #et-boc #et-main-area h2,
body.woocommerce-account #page-container #et-boc #et-main-area .woocommerce-MyAccount-content header.woocommerce-Address-title h2 {
  font-weight: 400;
  font-size: 24px;
}

/*Account page style end*/

Related product style


/*Related product style start*/
body #page-container #et-boc #et-main-area ul.products,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products ul {
  display: flex;
  column-gap: 10px;
  row-gap: 10px;
  margin-left: -10px;
}
body #page-container #et-boc #et-main-area ul.products li.product .button,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .button {
  position: absolute;
  bottom: 15px;
}
body #page-container #et-boc #et-main-area ul.products li.product,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li {
  padding-bottom: 100px !important;
}
body #page-container #et-boc #et-main-area ul.et_pb_tabs_controls {
  background-color: transparent;
}
body #page-container #et-boc #et-main-area ul.products li.product,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li {
  background: #fff;
  box-shadow: 0 2px 18px 0 rgba(0, 0, 0, 0.05);
  padding: 0px 15px 15px 15px;
  border-radius: 8px;
  margin: 0;
  overflow: hidden;
}
/*Related product style end*/

Product details page style


/*Product details page style start*/
body #page-container #et-boc #et-main-area .et_pb_wc_tabs .description_tab {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

body #page-container #et-boc #et-main-area ul.products li.product .et_shop_image,
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .et_shop_image {
  margin-left: -15px !important;
  margin-right: -15px !important;
}
body #page-container #et-boc #et-main-area .et_pb_wc_related_products li .et_shop_image .et_overlay {
  display: none;
}
body #page-container #et-boc #et-main-area .et_pb_shop .woocommerce-notices-wrapper {
  display: none;
}
body.single-product #page-container #main-header {
  background-color: #057dcd;
}
/*Product details page style end*/

Checkout page style


/*Checkout page style start*/

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {    
    background-color: transparent;
     
}
body.woocommerce-order-received .ppb-chckout-wrap .et_pb_column:nth-child(1) {
  display: none;
}
body.woocommerce-order-received .ppb-chckout-wrap .et_pb_column:nth-child(2) {
  width: 100%;
}
body.woocommerce-order-received .ppb-chckout-wrap .et_pb_wc_checkout_payment_info {
  background: transparent;
}

body #page-container #et-boc #et-main-area .woocommerce-order-details__title,
body #page-container #et-boc #et-main-area .woocommerce-column__title {
  font-weight: 400 !important;
	font-size: 30px;
}
body.woocommerce-checkout #page-container #et-boc #et-main-area .et_pb_wc_checkout_payment_info{
      background: #e6f4f9;
}
body.woocommerce-checkout .product-name a{
  color: #2ea3f2;
}
body.woocommerce-checkout .product-name a:hover{
  color: #FFCE75;
}
/*Checkout page style end*/

Woocommerce form style


/*Woocommerce form style start*/
.woocommerce .quantity input.qty,
.woocommerce-page .quantity input.qty,
.woocommerce #content .quantity input.qty,
.woocommerce-page #content .quantity input.qty,
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.et_pb_wc_cart_totals .select2-container--default .select2-selection--single,
.et_pb_wc_checkout_billing .select2-container--default .select2-selection--single,
.et_pb_wc_checkout_shipping .select2-container--default .select2-selection--single,
body #page-container #et-boc #et-main-area .et_pb_wc_checkout .et_pb_wc_checkout_section .form-row input.input-text,
body #page-container #et-boc #et-main-area .et_pb_wc_checkout_section .form-row textarea,
body #page-container #et-boc #et-main-area .et_pb_wc_checkout_section .form-row input.input-text,
body #page-container #et-boc #et-main-area .et_pb_wc_checkout_section .form-row textarea,
:where(.woocommerce) .select2-container .select2-selection--single .select2-selection__rendered {
  font-size: 14px;
  padding: 13px 15px;
  border-radius: 8px;
  background-color: #e6f4f9;
  border: 1px solid #fff;
  font-size: 16px;
  color: #1e3d58 !important;
  font-family: "Source Sans Pro", Helvetica, Arial, Lucida, sans-serif;
	     
}
.et_pb_wc_checkout_billing .select2-container--default .select2-selection--single{
 min-height: 55px;	
}
:where(.woocommerce) .select2-container .select2-dropdown,
:where(.woocommerce) .select2-container .select2-selection {
  border: none;
}
.et_pb_wc_cart_totals .select2-container .select2-selection--single .select2-selection__rendered,
.et_pb_wc_checkout_billing .select2-container .select2-selection--single .select2-selection__rendered,
.et_pb_wc_checkout_shipping .select2-container .select2-selection--single .select2-selection__rendered {
  color: #1e3d58 !important;
border: none;
padding: 0;	  
}



/* Chrome, Safari, Opera */
.woocommerce-input-wrapper ::-webkit-input-placeholder {
  color: #1e3d58;
}

/* Firefox 19+ */
.woocommerce-input-wrapper ::-moz-placeholder {
  color: #1e3d58;
  opacity: 1;
}

/* IE 10-11 */
.woocommerce-input-wrapper :-ms-input-placeholder {
  color: #1e3d58;
}

/* Microsoft Edge (Legacy) */
.woocommerce-input-wrapper ::-ms-input-placeholder {
  color: #1e3d58;
}

/* Standard Modern Rule */
.woocommerce-input-wrapper ::placeholder {
  color: #1e3d58;
  opacity: 1;
}
.et_pb_wc_checkout_payment_info form .form-row{
	margin-top: 0;
}

/*Woocommerce form style end*/
/*------------------------------------------------
---------------- Woocommerce Style End ---------------
------------------------------------------------*/

Table of Contents